如何使用 jQuery 找到下一个元素？答案

【问题标题】：how I can find with jQuery the next element?如何使用 jQuery 找到下一个元素？
【发布时间】：2013-04-24 11:29:00
【问题描述】：

我如何找到下一节课的“评论”并在点击“阅读”后显示？

<div class="preview">
<div class="messages">
    <div class="msg">
        <div class="circle left"><img src=""></div>
        <div class="name">Lars Mehrhoff</div>
        <div class="sep_20"></div>
        <a href="#" class="read"><i class="icon-comment"></i></a>
        <a href="#" class="reply"><i class="icon-reply"></i></a>
        <a href="#" class="read"><i class="icon-ok"></i></a>
        <a href="#" class="trash"><i class="icon-trash"></i></a>
        <div class="comment">ASD</div>
    </div>

    <div class="clearfix"></div>

    <div class="msg">
        <div class="circle left"><img src=""></div>
        <div class="name">Lars Mehrhoff</div>
        <div class="sep_20"></div>
        <a href="#" class="read"><i class="icon-comment"></i></a>
        <a href="#" class="reply"><i class="icon-reply"></i></a>
        <a href="#" class="read"><i class="icon-ok"></i></a>
        <a href="#" class="trash"><i class="icon-trash"></i></a>
        <div class="comment">ASD</div>
    </div>
</div>

我的 jQuery 代码是这样的：

    $('.read').click(function(e) {
    $(this).find('.comment').show();
});

$('.comment').hide();

我只会显示“已读”旁边的评论

【问题讨论】：

如果siblings 对您来说还不够：stackoverflow.com/a/30089307/274502

标签： jquery html css

【解决方案1】：

你可以使用.siblings()方法：

$(this).siblings(".comment").show();

【讨论】：

我怀疑.next() 是否可以使用他的结构，因为它不是.read 的下一个直接兄弟
我认为在这种情况下，wirey 是正确的。 siblings() 会起作用，但这只是因为有一个节点的类 .comment 与单击的 .read 元素处于同一级别。
@antony .siblings() 将按照 OP 提供的信息说明他的 HTML 结构来工作。
@wirey 正确，我已从答案中删除了 .next() 示例。
@97dave。是的，我说过它会起作用，但只能在那个结构下:)

【解决方案2】：

你可以试试下面的

$('.read').click(function(e) {

    $(this).parent().find('.comment').show(); 
});

$('.comment').hide();

希望对你有帮助

【讨论】：

【解决方案3】：

试试$(this).siblings('.comment').show();。

【讨论】：