Why setTimeout() with 0 ms. is affect in my function

Question

In my case when hovering <div> so prepend one element inside the <div>

But in some div i want to hide prepended element after hovered element.

This is my code and its work !

HTML :

<div class="one">
    <span class="content"></span>
</div>


<div class="two">
    <span class="content"></span>
</div>

jQuery :

$("div.one > .content").on("hover" , function(){
    var this_ = $(this);
    this_.prev(".top").remove();
});


$("div.two > .content").on("hover" ,function(){
    var this_ = $(this);
    setTimeout(function(){this_.prev(".top").remove();})
});

.one and .two both are same function, But I want to know why second function affect when I using setTimeout() and timing is 0 millisecond , Why 0 millisecond is affect in my function ?

Demo : http://jsfiddle.net/nShCy/

Answer 1

It's not 0 ms, it's 4 ms delay.

The answer is simple: mouseenter is fired after hover, so you're trying to remove the element that doesn't exist yet. With a 4ms pause and a hover callback that finishes in less than 4 ms it works as expected.