jquery - 複数のインスタンスなしでネストされたアコーディオンメニューを使用するにはどうすればよいですか？

Question

これが私のベースです：

http://jsfiddle.net/UnV4Z/

そして、私はそれを2つではなく3つのレベルにしたいと思っています。私はそれをここで機能させています：

http://jsfiddle.net/RnwYQ/13/

しかし、それは私がカテゴリーごとに1つのインスタンスを持たなければならないことを意味します。これを行うためのよりクリーンな方法はありますか？

Answer 1

アコーディオンにクラスを与え、クリックされた要素に基づいて兄弟を非表示にするようにコードを少し変更してみてください。

http://jsfiddle.net/RnwYQ/19/

$(".accordion > li > div").click(function() {

    if (!$(this).next().is(':visible')) {
        $(this).parent().siblings().children("ul").slideUp(300);
    }
    $(this).next().slideToggle(300);
}).parent().filter(":first-child").children("div").click();​