JQuery - 目标跟随元素

Question

我正在为我开发的ActionScript 3框架创建一些文档。为了保持一致，感觉将尽可能贴近Adobe liveocs。

左边有一个面板，我希望有一个按包分类的类树。到目前为止，HTML看起来像这样：

<ul id="directory">
    <li class="package">zephyr</li>
    <ul>
        <li><a href="/docs/zephyr/class/foundation.php">zephyr.<strong>Foundation</strong></a></li>

        <li class="package">zephyr.core</li>
        <ul>
            <li><a href="/docs/zephyr/class/core.php">zephyr.core.<strong>Core</strong></a></li>
            <li><a href="/docs/zephyr/class/heart.php">zephyr.core.<strong>Heart</strong></a></li>
            <li><a href="/docs/zephyr/class/manager.php">zephyr.core.<strong>Manager</strong></a></li>
            <li><a href="/docs/zephyr/class/signature.php">zephyr.core.<strong>Signature</strong></a></li>
        </ul>

        <li class="package">zephyr.entity</li>
        <ul>
            <li><a href="/docs/zephyr/class/entity.php">zephyr.entity.<strong>Entity</strong></a></li>
        </ul>
    </ul>
</ul>

您会注意到每个包都有类package，并且后面紧跟着：

<ul>...</ul>

我想在此JQuery片段中的每个<ul>之后立即选择此li.package元素：

$("li.package").click(function()
{
    var ul = ??; // <---- get relevant ul here

    ul.slideToggle(300);
});

我怎样才能做到这一点？

Answer 1

使用

$(this).next('ul');

这意味着找到点击的ul元素旁边的li元素。

有关示例，请参阅此fiddle。