Hover effect jquery not working
===

I trying to do hover effect using following code. But its not working please help me 

Script

    $('.sha').hover(
      function () {
        $(this).next().children('div').css('display','block');
      }, 
      function () {
        $(this).next().children('div').css('display','none');
      })

HTML

    <div class="listing_share_cont"><a href="#" class="sha">Share</a> <img src="images/listing_share_arrow_down.jpg" alt=" ">
    					
    					
    					<div class="list_view_share_button_pop_up_cont">
      <div class="list_view_share_button_pop_up_cont_arrow"><img src="images/home_list_view_share_pop_arrow.png" alt=" " /></div>
      
      <div class="list_view_share_button_pop_up"><img src="images/facebook_icon.jpg" alt=" " /> <img src="images/twitter_icon.jpg" alt=" " /> <img src="images/mail_icon.jpg" alt=" " /> <img src="images/in_icon.jpg" alt=" " /> <img src="images/you_tube_icon.jpg" alt=" " /> <img src="images/fav_icon.jpg" alt=" " /> <img src="images/google_plus_icon.jpg" alt=" " /></div>
    </div>
    					
    					
    					
    					</div>

CSS

    .list_view_share_button_pop_up_cont{float: left; left: 10px; position: absolute; top: 9px; width:285px; display:none;}
    .list_view_share_button_pop_up_cont_arrow{float:left; width:265px; margin:0 0 -4px 0;}
    .list_view_share_button_pop_up{float:left; width:265px; background:#0474be; padding:8px 8px 4px 8px;}


