Mam problem z dynamicznie tworzonymi elementami w stanie najechania. Po najechaniu na nowo utworzony element HTML nie działa.

Oto mój kod HTML:

<button id="create">create new button</button>
<button class="hover">hover me</button>
<div></div>

jQuery:

var createBtn = $("#create");

createBtn.click(function() {
    $('div').append('<button class="hover">new hover button</button');  
    return false;        
}); 


$('.hover').hover(function() {
    alert('you hovered the button!');
}, function() {
    alert('you removed the hover from button!');
});

Próbowałem nawet tego kodu:

$('.hover').on({
    mouseenter : function() {
         alert('you hovered the button!');
    },
    mouseleave : function() {
        alert('you removed the hover from button!');
    }

});

jak pokazano tutajhttp://api.jquery.com/on/, ale wciąż nie ma szczęścia. Oto także demo:http://jsfiddle.net/BQ2FA/