Question

In my html code there are list items. I want to show and hide related fav div when hover the related list item. But i can not relate fav div and it’s list item.

html:

<ul>    
<php? for(....): ?>                            
    <li>
        <div id="sin">
            some stuff 
        </div>
        <div id="son">
            some stuff
        </div>
        <div id="fav">
            something 
        </div>
        <br />
    </li>
<php? endfor; ?>
</ul> 

when mouse over <li> tags “fav” div which belongs to mouse overed list item has to appear.

My unworked jquery code:

$(document).ready(function()
{          
    $("li").hover(function(){
        $("#fav").show()},
        function () {
        $("#fav").hide()
    });
});

Answer 1

The problem is that you are using same id multiple times. You need to use class="fav" instead of id="fav"

//for #sin and #son also

$(document).ready(function()
{          
    $("li").hover(function(){
        $("#fav").show()},
        function () {
        $("#fav").hide()
    });
});

should be

$(document).ready(function()
{          
    $("li").hover(function(){
        $(this).find(".fav").show()},
        function () {
        $(this).find(".fav").hide()
    });
});