[jQuery] parent trouble
[jQuery] parent trouble
I have a nested (many levels) list, each item containing a link which,
among other things should cause a child list (if there is one) to
display. All child lists are hidden by default.
<div id="section_list">
<ul>
<li class="Section" id="one">
<a href="...">...</a>
<ul>
...
</ul>
</li>
<li class="Section" id="two">
<a href="...">...</a>
<ul>
...
</ul>
</li>
</ul>
</div>
The section classes are only in the top-level list. The list IDs are
only here for explanation.
What I need to do is close any section that's already open when a link
is clicked--except if the link is in the open section. So, if the list
under #one is open, and the user clicks the link under #two, the first
list should close before the one under #two opens. There's a bunch of
other stuff involved but I pared it down to the essentials.
My problem is how to remove the clicked link's section's UL from
closing. Otherwise, it closes, then re-opens. This is my latest feeble
attempt:
$('#section_list a').click(function()
{
/* clunky!
*/
var parent_section = $(this).parents('ul').get($(this).parents('ul').size()-2);
/* hide all sections except this one
*/
$('#section_list li.Section ul').not($(parent_section)).hide('slow');
/* show child list if present
*/
$(this).next('ul').show('slow');