单击元素后的第一个元素

Question

如何在点击元素后立即获取具有特定类的first元素。

<div class="box"></div>
<div class="box"></div>
<div class="box-data"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box-data"></div>

这是我无法解决的问题：

$(".box").click(function() {
    $(":first .box-data").css("display", "block");
    //$(this).find(":first .box-data").css("display", "block");
});

默认情况下box-data不可见，但不幸的是，通过上面的代码，它们都会可见！

P.S。 display: none;已定义box-data。

Answer 1

使用nextAll(".box-data")和first()：

$(".box").click(function() {
    $(this).nextAll(".box-data").first().css("display", "block");
});

nextAll按顺序返回以下兄弟，first只选择其中的第一个（first = eq(0)）。