I'm making a sub nav in wordpress and have a nested list style menu. An example of the HTML is below. Whichever is the current item has the li class "current_page_item". I need all child menus collapsed unless there is a current_page_item class on the parent or one of the children.

<ul>
 <li class="current_page_item"><a href="#">Parent Item</a>
  <ul class="children">
   <li><a href="#">Child page</a></li>
   <li><a href="#">Child page</a></li>
   <li><a href="#">Child page</a></li>
   <li><a href="#">Child page</a></li>
  </ul>
 </li>
 <li><a href="#">Parent Item</a>
  <ul class="children">
   <li><a href="#">Child page</a></li>
   <li><a href="#">Child page</a></li>
  </ul>
 </li>
 <li><a href="#">Parent Item</a>
  <ul class="children">
   <li><a href="#">Child page</a></li>
   <li><a href="#">Child page</a></li>
  </ul>
 </li>
 <li><a href="#">Parent Item</a></li>
 <li><a href="#">Parent Item</a></li>
</ul>

This so far, which works but i wonder if it can be improved as there is some flashing open and then closed again....

jQuery('ul.children').slideUp(); jQuery('li.current_page_item ul.children').slideDown('medium'); jQuery('li.current_page_item').parent().slideDown('medium');