Problem with fading background Image functions in Google Chrome

Question

Hello all.

I have this small function that allows me to fade background image on hover on my menu .

$('.menu li').append('<span class="hover" />').each(function() {
    var $span = $('> span.hover', this).css('opacity', 0);
    $(this).hover(function() {
        $span.stop().fadeTo(300, 1);
    }, function() {
        $span.stop().fadeTo(1500, 0);
    });
}); 

It works just fine everywhere apart from Google Chrome where the function is breaking.

I truly cant find reason why?

Can anyone help me please

Thank you in advance

Dom