Question

I am relatively new to jQuery, and I would like to be able to show a menu on mouseover.

Here is the HTML content:

<td class ="comment_div"> <?php echo("$comment_data['comment']); ?> <br/>
    <span class="comment_actions"> Approve | Delete | Spam | Edit</span>
</td>

Then the jQuery code:

$("comment_div").hover(
    function() { $(".comment_actions").show(); },
    function() { $(".comment_actions").hide(); }
);

This works except for I’m pulling multiple comments out and this only will show the menu on the first div no matter what “comment” is hovered. I would like to have the menu show only for the comment that is currently being hovered over. I think I need to use “$this” to make this work, but I am not sure how.

Answer 1

If I’m reading that correctly, the format should be-

$(".comment_div").hover(
  function() { $(this).children(".comment_actions").show(); },
  function() { $(this).children(".comment_actions").hide(); }
);