jquery doesn't remove div always on mouseleave
<p>This is very annoying. After you rollover on image, if you rollout from left, top or right edges red box disappears. But if you rollout from bottom edge red box sometimes disappears sometimes not. Why is that?</p>

<p><a href="http://jsfiddle.net/f98r3/2/" rel="nofollow">http://jsfiddle.net/f98r3/2/</a></p>

<p><em><strong>Edit:</em></strong>
Another weird thing is, when you check console log, mouseleave fires but doesn't remove div!!!.</p>

<p><em><strong>Edit 2:</em></strong>
Ok both answers solved the problem but still I wonder how on earth console.log logs the mouseleave in the original code but doesn't trigger remove()?</p>
