JQuery - 目标跟随元素

Question

我正在为我开发的 ActionScript 3 框架创建一些文档。为了保持一致性，感觉将尽可能接近 Adob​​e livedocs。

左侧有一个面板，我想要一个按包分类的类树。到目前为止的 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 片段中选择紧跟在每个 li.package 之后的这个 <ul> 元素：

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

    ul.slideToggle(300);
});

我怎样才能做到这一点？

Answer 1

使用

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

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

请参阅此fiddle 以获取示例。