Hi, Your code is missing th </ul> for <ul id="second">
When I add this in everything toggles as expected --> http://jsbin.com/esaso/edit Paul On May 6, 3:37 am, brian <bally.z...@gmail.com> wrote: > jquery 1.3.2 > > I have a nested group of lists similar to below where all but the > top-level list is hidden. Clicking a link should open the next level > (as well as do some AJAX stuff). I'm having some trouble getting the > 2nd level to open without also opening the 3rd level when clicking on > a top-level link. > > (The IDs are here clarity) > > <ul id="first"> > <li class="Section"> > <a href="">...</a> > <ul id="second"> > <li> > <a href="">...</a> > </li> > <li> > <a href="">...</a> > <ul id="third"> > <li> > <a href="">...</a> > </li> > <li> > <a href="">...</a> > </li> > </li> > </ul> > </li> > <li class="Section"> > ... > </li> > </ul> > > My code closes the lists on load like so: > > $('#nav li.Section ul').hide(); > > This line, in the click handler, opens the next nav if there is one > inside the clicked anchor's list item: > > $(this).next('ul').toggle('slow'); > > However, it's also opening the 3rd level when clicking an anchor at > the top level. From my reading of the API, next('ul') should only be > returning the 2nd level UL. Am I misunderstanding? Is there a better > way to grab only the *very next* ul?