CODEWITHSUNDEEP
javascriptjquerymouseover
Denn
Denn

Reputation: 83

How to show an element in each div?

My code is:

<div id="post">
<a href="./?act=remove&post_id=13" id="remove">Delete</a>
<b>Admin</b> says:
"Hi to all my frends!"
<br>
7 hours ago &middot; 
<a id="like" href="./?act=like&id=13" title="No one likes">Like</a> &middot; 
<a id="dislike" href="./?act=dislike&id=13" title="No one dislikes">Dislike</a>
</div>

I also have multiple posts like this one above... How can i make with jQuery that every time I "mouseover" #post, the #remove inside that #post appears?

Upvotes: 0

Views: 55

Answers (2)

Wolfram
Wolfram

Reputation: 8052

First I think you want to use class="post" and class="remove" if you have multiple posts like that one. Then you can do it like this (the code on jsfiddle):

$(".post").on("mouseover", function(){
    $(this).find(".remove").show();
}).on("mouseout", function(){
    $(this).find(".remove").hide();
});

Some jQuery functions you might want to look into: .on(), .mouseover(), .mouseout(), .hover().

Upvotes: 2

BumbleB2na
BumbleB2na

Reputation: 10743

I made an example for you:

http://jsfiddle.net/BumbleB2na/a5vuD/1/

You want to use classes instead of IDs to support multiple posts. Also, you should hide your "remove" elements on startup.

Upvotes: 2

Related Questions