Html 引导按钮使用下拉菜单显示标题中的选定项

我想要与此问题中显示的功能类似的功能

但问题是我无法获取唯一的按钮值，它会在“所有”下拉列表中显示最后选定的值

这是我的代码，我从上面的链接

HTML引导

<div class="col-2">
    <div class="dropdown">
        <button class="btn btn-warning btn-xl dropdown-toggle" type="button" id="sizevalue1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
           <span class="selection1"><i class="icon icon-center mdi mdi-plus-circle-o"></i> Names</span>
        </button>
        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
            <li><a href="#" data-value="1"><span class="new-button-dropdown blockquote">Action 1</span></a></li>
            <li><a href="#" data-value="2"><span class="new-button-dropdown blockquote">Action 2</span></a></li>
            <li><a href="#" data-value="3"><span class="new-button-dropdown blockquote">Action 3</span></a></li>
            <li><a href="#" data-value="4"><span class="new-button-dropdown blockquote">Action 4</span></a></li>
        </ul>
    </div>
</div>
<div class="col-2">
    <div class="dropdown">
        <button class="btn btn-warning btn-xl dropdown-toggle" type="button" id="sizevalue2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
          <span class="selection2"><i class="icon icon-center mdi mdi-plus-circle-o"></i> Titles</span>
        </button>
        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
            <li ><a href="#" data-value="10"><span class="new-button-dropdown blockquote">Action 10</span></a></li>
            <li ><a href="#" data-value="20"><span class="new-button-dropdown blockquote">Action 20</span></a></li>
            <li ><a href="#" data-value="30"><span class="new-button-dropdown blockquote">Action 30</span></a></li>
            <li ><a href="#" data-value="40"><span class="new-button-dropdown blockquote">Action 40</span></a></li>
        </ul>
    </div>
</div>

我已经编写了两个jquery，但只有一个可以同时使用。如何对此进行分类并获得唯一的按钮值

---

谢谢

它工作正常不确定您想要什么是的，选择时工作正常，但我想要两个按钮的值相同。我已经在html代码中给出了它的id值。当我从下拉选择中选择时，我想要基于上述锚定标记的数据值的唯一id值。它工作正常不确定您想要什么是的，选择时效果很好，但我想要的按钮值是相同的。我已经在html代码中给出了它的id值。我想要唯一的id值基于锚标记的数据值，如上所述，当我从下拉选择中选择时。

$(".dropdown-menu li a").click(function() {
   $(this).parents(".dropdown:first-child").find('.selection1').text($(this).text());       $(this).parents(".dropdown").find('.selection1').val($(this).text());
   $("#sizevalue1").val($(this).text());
});
$(".dropdown-menu li a").click(function() {          
   $(this).parents(".dropdown").find('.selection2').text($(this).text());        
   $(this).parents(".dropdown").find('.selection2').val($(this).text());        
   $("#sizevalue2").val($(this).text());
});