jquery accordeon menu, sibling open sub-menu -

jquery accordeon menu, sibling open sub-menu -

i'm suing jquery code open , close sub menu when clicking on menu item. works fine, have problem close opened sub menu when clicking on top menu item.

for example, when clicking on menu 2, when sub-menu 1 openned, want sub-menu 1 close when sub-menu 2 opens.

i guess i'm doing wrong whith sibling function can't find out what...

here html (i can't modify html, it's wordpress generated menu

<div class="menu-menu_top-container"> <ul id="menu-menu_top" class="menu"> <li id="menu-item-67" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-has-children menu-item-67"><a href="#">menu 1</a> <ul class="sub-menu"> <li id="menu-item-63" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-49 current_page_item menu-item-63"><a href="#">sub menu 1</a></li> <li id="menu-item-62" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-62"><a href="#">sub menu 2</a></li> <li id="menu-item-61" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-61"><a href="#">sub menu 3</a></li> <li id="menu-item-60" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-60"><a href="#">sub menu 4</a></li> <li id="menu-item-59" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-59"><a href="#">sub menu 5</a></li> <li id="menu-item-66" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-66"><a href="#">sub menu 6</a></li> </ul> </li> <li id="menu-item-76" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-76"><a href="#">menu2</a> <ul class="sub-menu"> <li id="menu-item-80" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-80"><a href="#">sub menu 1</a></li> <li id="menu-item-79" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-79"><a href="#">sub menu 2</a></li> <li id="menu-item-78" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-78"><a href="#">sub menu 3</a></li> <li id="menu-item-77" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-77"><a href="#">sub menu 4</a></li> </ul> </li> <li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a href="#">menu 3</a></li> <li id="menu-item-44" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-44"><a href="#">menu 4</a></li> <li id="menu-item-45" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-45"><a href="#">menu 5</a></li> <li id="menu-item-43" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-43"><a href="#">menu 6</a></li> </ul> </div>

here js code :

$("ul.sub-menu").hide(); $(".menu-menu_top-container li a").click(function() { $(this).next("ul.sub-menu").slidetoggle('xfast').siblings('ul.sub-menu:visible').slideup('xfast'); });

and jsfiddle : http://jsfiddle.net/mfb8f/1/

can help me ?

thanks lot,

$(".menu-menu_top-container li a").click(function () { $('ul.sub-menu').not( $(this).next() ).slideup(); $(this).next("ul.sub-menu").slidetoggle(); });

http://jsfiddle.net/isherwood/mfb8f/11

jquery menu accordion submenu siblings