複数のボタンで各ボタンを個別に切り替える方法は？

Question

私は同じボタンを何度も何度も表示しています。私はそのボタン

<button type="button" class="pull-right btn menu"> 
    <span class="glyphicon glyphicon-option-vertical" aria-hidden="true"></span> 
</button> 
<ul class="downmenu"> 
    <li><a href="#">Action</a></li> 
    <li><a href="#">Another action</a></li> 
    <li><a href="#">Something else here</a></li> 
    <li role="separator" class="divider"></li> 
    <li><a href="#">Separated link</a></li> 
</ul> 

とjsのコードをクリックした後、次のデータをトグルする必要が

$('.menu').click(function(){ 
    $(this).each(function(){ 
    $('.downmenu').toggle('show'); 
    }); 
    }); 

私の問題は、いずれかのボタンをクリックした後、すべてのボタンが機能していることです。それぞれ別々に切り替える方法。私は各ボタンのdownmenu ulリストをトグルする必要がありますので、どうすればいいですか？

Answer 1

クリックイベント内のループは冗長です。問題は、そのクラスのすべての要素を選択する.downmenuのグローバルセレクタです。

$('.menu').click(function(){ 
    $(this).next('.downmenu').toggle('show'); 
});