jq点击li 显示当前li下面的内容

鼠标移动到当前li上之后 显示下方关注 和 发信息按钮  

$(document).ready(function(){
    $(".userDisplay li").hover(function() {
        $(this).find(".yhgn p").css("display","none");
        $(this).find(".yhgn-2 ").css("display","block");
    }, function() {
        $(this).find(".yhgn p").css("display","block");
        $(this).find(".yhgn-2 ").css("display","none");
    });
});

 <div class="userDisplay">
                     <ul>
                         <li>
                             <a href="www.baidu.com"><img src="img/girl-1.jpg" class="userImgs" alt=""></a>
                             <div class="yhgn">
                                 <p class="content">Rszs</p>
                                 <!--<img src="img/guanzhu.png"  style="width:27px;height:24px;margin-top:10px;margin-left:45px;" alt="">-->
                                 <!--&lt;!&ndash;<img src="img/guanzhu.png"  style="width:20px;" alt="">&ndash;&gt;-->
                                 <!--<img src="img/icon_talk.png"  style="width:26px;margin-top:8px;margin-left:21px;" alt="">-->
                             </div>

                             <!--关注发信息显示 -->
                             <div class="yhgn-2">
                                 <img src="img/guanzhu.png" class="gzme"   style="width:27px;height:24px;margin-top:10px;margin-left:45px;" alt="">
                                 <!--<img src="img/guanzhu.png"  style="width:20px;" alt="">-->
                                 <img src="img/icon_talk.png" class="fmesm"  style="width:26px;margin-top:8px;margin-left:21px;" alt="">
                             </div>

                         </li>
</div>

代码如上.........

 

点击当前li下面的 关注按钮  只修改当前li的内容

$(".userDisplay li .gzme").click(function(){
    $(this).attr("src"," img/guanzhuh.png");
});