Создание меню slashdot с помощью JQuery

Question

Я просто пытаюсь создать меню slashdot для своего сайта, и вот что я получил:

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

Это просто не работает, как вы можете видеть здесь

Мой HTML это:

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

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

Надеюсь, кто-нибудь может помочь мне заставить это работать.

Answer 1

Тебе не нужно делать each and the click, просто нажмите петлю позаботится об обоих.

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

скрипка: http://jsfiddle.net/HEC7z/2/