jquery - 順序付けられていないリストの異なるスタイルのアコーディオン スライダー

Question

ここに私のhtmlがあります

<div id="1" class="category_group">
<ul class="top_level_category">
    <li><a>top level title 1</a>
        <ul class="sub_level_category">
            <li>lower level links</li>
            <li>lower level links</li>
            <li>lower level links</li>
            <li>lower level links</li>
        </ul>
    </li>
</ul>

<div id="2" class="category_group">
<ul class="top_level_category">
    <li><a>top level title 2</a>
        <ul class="sub_level_category">
            <li>lower level links</li>
            <li>lower level links</li>
            <li>lower level links</li>
            <li>lower level links</li>
        </ul>
    </li>
</ul>

これが私のjqueryになります

$('div ul li ul').hide();
$('div ul li a').click(function() {
$(this).find('ul').show();
});

アコーディオンを作っているのですが出来ません、リストの構造が普通と違います

サンプル

Answer 1

find()選択した要素の特定の子孫要素を検索するには、次のnextメソッドを使用できます。

$('div ul li a').click(function(e) {
    e.preventDefault();
    $(this).next('ul').toggle();
});

http://jsfiddle.net/6rXp2/

Answer 2

または$(this).find('ul').show();で変更$(this).parent().find('ul').show();$(this).next('ul').show();