Hi. I want to collapse my navigation. But I can't select the nested
<ul> inside a <li>
The markup:
<ul id="navigation">
        <li>Fruits
           <ul>
              <li>Apples</li>
              <li>Bananas</li>
              <li>Strawberries</li>
           </ul>
         </li>
         <li>Vegetables
                <ul>
                  <li>Tomatoes</li>
                  <li>Peas</li>
               </ul>
         </li>

This is what I tried to do:
$('#navigation li').click(function() {
                $(this).next().slideToggle("fast");
        });

But this code doesn't collapse the nested ul but the next li. When I
click Fruits it'll toggle Vegetables.
How can I select just the ul inside the li? When I click Fruits it
should toggle the ul with Apples, Bananas ...

This one won't work either:
$('#navigation li').click(function() {
                $(this ' ul').slideToggle("fast");
        });
or this:
$('#navigation li').click(function() {
                $(this).child().slideToggle("fast");
        });

Hope somebody can help. Thanks!

Reply via email to