如何访问元素行中的“next”div

Question

以下是示例代码。我想要发生的是当我单击特定缩进div上方的“切换”链接时，我希望它toggleSlide div.indented在它下面但不影响其他缩进元素...我无法改变div的布局所以我需要弄清楚如何使用jquery访问它。

如果他们彼此在同一个div中，我怀疑我可以使用：

jQuery(this).siblings(".indented").slideToggle(500);

所以寻找那种功能......我可以像.next（）一样使用吗？但这似乎也不起作用。

<script type="text/javascript">
    jQuery(document).ready(function() {
      jQuery(".link").click(function() {
         jQuery(".indented").slideToggle(500);
      });
    });
</script>


<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

<!-- Comment #2 --->

<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

<!-- Comment #3 --->

<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

Answer 1

jQuery(document).ready(function() {
      jQuery(".link").click(function() {
         jQuery(this).closest(".comment").next('.indented').slideToggle(500);
      });
    });