unbind not working

Any idea what I am doing wrong?

I am trying to get the "hover" not to apply to text3.

$(document).ready(function() {

runIt();

});

function runIt(){
$('#myText').hover(function(){
        $(this).clearQueue().html('Start Again');

})
.click(function(){
    runIt();
})
.html('text 1')
.fadeIn(1000)
.delay(1000)
.fadeOut(1000,function(){
    $(this).html('text 2');
})
.fadeIn(1000)
.delay(1000)
.fadeOut(1000,function(){
    $(this).html('text 3').unbind('hover');
})
.fadeIn(1000);
开发者_运维问答

};

.hover() is actually a shortcut, so to unbind you'll need to unbind the event handlers it created, you'll need to specify those events, mouseenter and mouseleave, like this:

$(this).html('text 3').unbind('mouseenter mouseleave');

As a side-tip, .ready() takes a function, so instead of this:

$(document).ready(function() {
  runIt();
});

You can just do:

$(document).ready(runIt);

Or the shortcut format, passing a handler directly to the jQuery constructor:

$(runIt);

All of the above will have the same effect here.