jquery showing elements on hover

I have a number of divs(myDiv) on a page. When the user hovers over one of the divs I would like to: after a little delay, display another div(myPop) on top. Almost like a tooltip. The code below is just not quite doing it. If the user moves t开发者_开发知识库he mouse across a number of myDivs then you can wait and see all the myPops fadein. I really want to just completely hide all the myPops that the user previously caused to be fadeIn. Because you end up with sort of trailing effect of all these myPops being displayed.

   $(".myDiv").hover(function () {
    $(this).find(".myPop").fadeIn('slow');
}, function () {
    $(this).find(".myPop").fadeOut('fast');
}
});

Try:

$(".myDiv").hover(function () {
    $(".myPop").stop();
    $(this).find(".myPop").fadeIn('slow');
}, function () {
    $(this).find(".myPop").fadeOut('fast');
});

You have a syntax error, you have an extra } for the second function, this should work:

$(".myDiv").hover(function () {
    $(this).find(".myPop").fadeIn('slow');
}, function () {
    $(this).find(".myPop").fadeOut('fast');
});