javascript - jQuery .hide() doesn't run on dynamically created elements

I want to dynamically create some div elements in my container. I do it with simple function:

function myFunction(volume){
for(var i = 1; i<= volume; i++){
$('.container').append("
");
}

The problem is that generated div elements does NOT react to my jQuery .hide() function. Does anyone know why it is not working? HTML looks fine for both manualy and dynamically created elements.

I did jsfiddle, but it is kinda broken too:
http://jsfiddle.net/gQBen/

My call of .hide() function

$('div').mouseenter(function() {
if (run){

$(this).hide(3000, function() {
result++;
run = false;
rewrite();
});
}
});

Aron solve it in comments: http://jsfiddle.net/arunpjohny/SM38C/1/ thanks!

Answer

you should use event delegation for that

$(".container").on("mouseenter","div",function(e){

});

Event delegation allows you to attach a single event listener, to a parent element, that will fire for all children matching a selector, whether those children exist now or are added in the future.