jquery timeout function not working properly
<p>I am using the <code>setTimeout</code> function to set <code>display: block;</code> and append to <code>li</code>, on mouseover. I just want to remove the block and make it none.</p>

<p>My function works fine but the problem is if the mouse crosses the <code>li</code>, it self the block getting visible. How can I avoid this?</p>

<p>my code is: </p>

<pre><code>var thisLi;
var storedTimeoutID;

$("ul.redwood-user li,ul.user-list li").live("mouseover", function(){
    thisLi = $(this);

    var needShow = thisLi.children('a.copier-link');

    if($(needShow).is(':hidden')){
        storedTimeoutID = setTimeout(function(){
            $(thisLi).children('a.copier-link').appendTo(thisLi).show();
        },3000);
    }
    else {
        storedTimeoutID = setTimeout(function(){
            $(thisLi).siblings().children('a.copier-link').appendTo(thisLi).show();
        },3000);
    }   
});

$("ul.redwood-user li,ul.user-list li").live("mouseleave", function(){      
    clearTimeout(storedTimeoutID);

    //$('ul.redwood-user li').children('a.copier-link').hide();
    $('ul.user-list li').children('a.copier-link').hide();
});
</code></pre>
