Selector with live() hover

I'm trying to bind the hover event to elements in my page using the following code:

$(".pinSelect-available").live('mouseover mouseout', function(e) {
alert(e.type);
if (e.type == 'mouseover') {
        // mouseover stuff
} else {
        // mouseout stuff
}
});

However the alert only calls out mouseout and on seemingly every element on my page despite assigning the .pinSelect-available class in the selector. I have also tried other things in my selector and they all do the same thing.

Any help on the matter would be much appreciated, than开发者_JAVA百科ks.

Are you using jQuery 1.4.1+? The jQuery docs page for .live() says the ability to assign multiple events was added in 1.4.1

I'm guessing you are though, as your example is from that page...

Just a reminder, you can't assign an event (even a .live() ) to a context that doesn't exist ex.

$(".pinSelect-available").live('mouseover mouseout', function(e) {
alert(e.type);
if (e.type == 'mouseover') {
        // mouseover stuff
} else {
        // mouseout stuff
}
});

It doesn't work if .pinSelect-available doesn't exist at this point in time, or is removed and re-created later.

You need to use 1.4.1+ for multiple event binding.