CODEWITHSUNDEEP
jqueryhtmlcss
Evolutio
Evolutio

Reputation: 974

how I can find with jQuery the next element?

how I can find the next class "comment" and shows it after I click "read" ?

<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>

And my jQuery Code is this:

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

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

I would display only the comment that is next to the "read"

Upvotes: 3

Views: 142

Answers (3)

97ldave
97ldave

Reputation: 5249

You can use the .siblings() method:

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

Upvotes: 4

Seder
Seder

Reputation: 2763

You can try the following 

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

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

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

I hope it can help

Upvotes: 0

Chuck Callebs
Chuck Callebs

Reputation: 16431

Try $(this).siblings('.comment').show();.

Upvotes: 1

Related Questions