JQuery How To Kill A Created Div?

What I have at the moment is a list of products (divs) that, when hovered over, a duplicate div is created and positioned over the original div (offset a bit and restyled using css

Solution 1:

Have you thought about using CSS to patch it?

.newDiv{
  display:none;
}
  .newDiv:hover{
    display:block;
  } 

That way, unhover will hide the div anyway. Might be that the rendering agent is quicker than the JS engine, saving you that momentary glitch.

Solution 2:

Maybe something like this:

jQuery('.newDiv').mouseleave(function() {
    var self = jQuery(this);
    setTimeout(function() {
        self.remove();
    }, 250);
});