0

Im just trying to creating a slashdot menu for my site and this is what I got so far:

$(document).ready(function () {  
    $('ul').each(function(){
        $(this).click(function(){
           $('ul').closest('li').slideToggle(300);
        });
    }); 
});

This just doesn't work at all as you can see here

My HTML is:

<ul>
    Click 1
    <li>1.1</li>
</ul>

<ul>
    Click 2
    <li>2.1</li>
</ul>

Hope someone can help me get this working.

Shawn31313
  • 5,978
  • 4
  • 38
  • 80

1 Answers1

0

you need not do each and the click. just click loop will take care of both.

$(document).ready(function () {  
           $('ul').click(function(){
            $(this).children('li:first').slideToggle(300);
        });
});

fiddle : http://jsfiddle.net/HEC7z/2/

dku.rajkumar
  • 18,414
  • 7
  • 41
  • 58
  • note that .closest() begins with the current element and travels up the DOM tree until it finds a match for the supplied selector. which is why he used first instead – jermel Dec 21 '11 at 04:51
  • he used "closest('li')", what i understand from this is he is trying to find out the closest li that is the first li inside the particular ul – dku.rajkumar Dec 21 '11 at 04:58
  • exactly, i was clarifying your answer. @dku used 'li:first' instead of closest() because closest is similar to parents – jermel Dec 23 '11 at 01:38