Dropdown в Dropdown при клике

[Timurkin]

Добрый день!
Помогите пожалуйста, не могу разобраться.
Использую реализацию dropdown в dropdown для Bootstrap.
Взял пример отсюда:

https://www.w3schools.com/bootstrap/..._css&stacked=h

Но мне надо разместить несколько dropdown внутри одного dropdown.
При клике на один dropdown, раскрывается следующий dropdown, как и надо. Но при клике на другие dropdown предыдущие не закрываются.
Как сделать чтобы закрывались предыдущие?

$(document).ready(function(){
  $('.dropdown-submenu a.test').on("click", function(e){
    $(this).next('ul').toggle();
    e.stopPropagation();
    e.preventDefault();
  });
});

[рони]

Timurkin,
html где?

[рони]

Timurkin,

$(document).ready(function(){
  $('.dropdown-submenu a.test').on("click", function(e){
    $(this).parent().siblings().find("ul").hide()
    $(this).next('ul').toggle();
    e.stopPropagation();
    e.preventDefault();
  });
});

[Timurkin]

<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">МЕНЮ
<span class="caret"></span></button>
	<ul class="dropdown-menu">
		<li class="dropdown-submenu">
			<a class="test" href="#">New dropdown <span class="caret"></span></a>
			<ul class="dropdown-menu">
				<li><a href="#">2rd level dropdown</a></li>
				<li><a href="#">2rd level dropdown</a></li>
			</ul>
			<li class="dropdown-submenu">
			<a class="test" href="#">Another dropdown <span class="caret"></span></a>
			<ul class="dropdown-menu">
				<li><a href="#">2rd level dropdown</a></li>
				<li><a href="#">2rd level dropdown</a></li>
			</ul>
			</li>
		</li>
	</ul>
</div>

[Timurkin]

Большое спасибо, вы мне очень помогли!!!