Несколько раскрывающихся кнопок, показывающих одни и те же данные, но кодированные по-разному

Question

У меня есть карточка на моей странице с двумя кнопками, у них обеих есть выпадающие списки, но вторая кнопка отражает первую кнопку, даже если данные списка совершенно разные.

Редактировать 1: убрал лишний li и добавил / ul в конец каждого списка.Мой пример здесь немного отличается от реального кода, так как мне пришлось пересмотреть его для конфиденциальности.

Редактировать 2: Для пояснения, согласно приведенному ниже примеру: в обоих раскрывающихся списках кнопок отображается пункт меню «имя ссылки», а второй выпадающий код кодируется как «имя ссылки 2».

Редактировать 3: Я могу закомментировать весь второй список, и он все еще показывает первый список на второй кнопке.

Примечание. Использование начальной загрузки 4

    <div class="card text-center">
                <div class="card-body">
                  <h4 class="card-title">Quick Links</h4>
                  <p class="card-text">Select your quick link ticket through the drop down menu.</p>
                 
                           
                            <button class="btn btn-primary dropdown-toggle" type="button"  data-toggle="dropdown" aria-haspopup="true" id="quicklinkbtn">
                              Select Quick Link
                            </button>
                            <ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
                                <li class="dropdown-submenu">
                                  <a class="dropdown-item" tabindex="-1" href="#">Location Name</a>
                                  <ul class="dropdown-menu">
                                    <li>
                                      <a data-toggle="tooltip" data-placement="top" title="Hover text overview of ticket type" class="dropdown-item menuLink" tabindex="-1" href="#">Link Name</a>
    </li>
    </li>
                                    </ul>
                                   </ul>
    <button class="btn btn-secondary dropdown-toggle" type="button"  data-toggle="dropdown" aria-haspopup="true" id="restrictedbtn">
                              Restricted Quick Links
                            </button>
                            <ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
                                <li class="dropdown-submenu">
                                  <a class="dropdown-item" tabindex="-1" href="#">Location</a>
                                  <ul class="dropdown-menu">
                                    <li>
                                      <a data-toggle="tooltip" data-placement="top" title="Hover text for link" class="dropdown-item menuLink" tabindex="-1" href="#">Link Name 2</a>
                                    </li>
    </li>
    </ul>
    </ul>
    </div>
    </div>
    
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>