Question

I am new to jQuery. I have jQuery code to create a accordion vertical menu bar. The default behavior of the menu bar is to hide all the child elements. The code to accomplish that is as following

var menu_ul = $('.menu > li > ul');
menu_ul.hide();

I would like save the state of the menu once user has clicked the top level menu and exposed the child options. I am able to add a particular class to the top level ul item to differentiate it from others.

To make this work I have to change the above jQuery code to hide all the ul items except with a particular class. In other words

Hide all the ul elements except where class=”show_item”

Please Help!!!

Answer 1

If you are looking to hide all unordered lists, not having the class show_item, you could use the :not selector to accomplish this.

$("ul:not(.show_item)").hide();

For improved readability, jQuery’s documentation suggests you consider the .not() filtering method:

$("ul").not(".show_item").hide();

Choose your poisin – either will work just fine.