Basically I need to hover over an anchor to display the "data-meta" div. Works just fine but when there's multiple td and divs, one hover displays all of them. My question is how can I show/hide them individually? Code snippets below.

<td>
<a href="#">Item</a>
<div class="data-meta">
    <a href="#">Edit</a> | <a href="#">Disable</a> | <a href="#">Delete</a>
</div>

 $(document).ready(function(){        
    $("td").hover(
        function () {
        $('.data-meta').show();
        },
        function () {
        $('.data-meta').hide();
    });
});