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"