change visibility for each div on mouseenter/mouseleave jquery

Question

I've looked at all the documentation on the jquery website, and I've also searched on all the questions related to my problem, but I have not found a solution. What I'm wanting to do is when you hover on the post class is to make the links in post span a to appear and to dissapear when the mouse leaves obviously... Right now, the only thing that is happening, is that when I hover over one of the post classes, the links will appear for every div, but I don't want that, I just want it like what happens on a twitter post, for example, when hover the posts, the reply, retweet, favorite, and more links appear. I want it like that.

$(function(){
  $.each(function(){
    $(".post").mouseenter(function(){
        $(".post span a").css("visibility", "visible");
    });
  });
  $.each(function(){
    $(".post").mouseleave(function(){
        $(".post span a").css("visibility", "hidden");
    });
  });
});

edit: Sorry about posting no HTML, here it is

  <div class="post">

                <span>
                    <a href="<?php echo base_url() . '/discussion/edit/' . $post['pid'];?>" class="post-edit" id="<?php echo $post['pid'];?>">edit</a>
                    &nbsp;
                    <a href="<?php echo base_url('discussion/delete/' . $post['pid']); ?>">delete</a>
                </span>
                </div>

Answer 1

I'd suggest:

$('.post').hover(function(){
    $(this).find('a').css('visibility','visible');
},
function(){
    $(this).find('a').css('visibility','hidden');
});