how to create jquery hover - php

Question

How do I create a jQuery hover to show a div when the mouse is over like twitter repla retweet and favorite?
Here is my HTML:
<div style="display:none;" id="blab">
<?php echo $blab_id; ?>
</div>
<a href="blab.php?id=<?php echo $blab_id; ?>">
<div class="blab_body" id="hover" value="Hide">
<table>
<tr>
<td valign="top">
<img src="<?php echo $profile_pic_info; ?>" class="blab_image" width="50" height="50" />
</td>
<td> </td>
<td>
<table>
<tr>
<td valign="top">
<a href="profile.php?id=$mem_id">
<strong><?php echo $added_fullname; ?></strong>
</a>
<?php echo $added_to_fullname; ?>
</td>
</tr>
<tr>
<td>
<?php echo $blab_body; ?>
</td>
</tr>
<tr>
<td>
<text style="color:gray;">
<?php echo $blab_date; ?>|<?php echo $device; ?>
</text>
</td>
</tr>
</table>
</td>
</tr>
</table>
<div style="background:#000; display:none;" id="id"> </div>
</div>
</a>
<hr />
and here is my JavaScript code:
$('#id').hide();
$('#hover').hover(function () {
var blab_id = $('#blab').text();
$('#id').show();
}, function () {
$('#id').hide();
});
It shows the div for the first one only.

Answer 1

You can only use a certain ID once on the whole page! If you insert more than one copy of this div on the page, your HTML code becomes invalid. That's why jQuery only attaches the event handler to the first element.
The solution is to use class="hover_enabled" instead of id="hover" as it is allowed to add the same class to multiple elements. Here is how you would do it in jQuery:
$('.hover_enabled').hover(function() { ...
The same thing applies to #id.