delegate/on with hover

Question

Possible Duplicate:
Using delegate() with hover()?

I am trying this code, but apparently I am doing something wrong. With this code the hover effect doesn't work.

However something like : $('.group>span').hover (function() { works well but I need to delegate the html() content.

<div class="group">
    <span></span>
</div>

$('.group>span').delegate("hover", "a", function() {
    $(this).html('<a href="#new_list">Some button</a>');
}, function() {
    $(this).empty();
});​

Any idea? thanks

Answer 1

hover is just a convenience wrapper around mouseenter and mouseleave. I think you will have to handle each separately.

Answer 2

The number of arguments you pass to the delegate is invalid. You pass 4 while it should take only 3.

.delegate( selector, eventType, handler(eventObject) ) is the function signature.
And the order of the parameters in your code is wrong! you swapped the selector and the event type

You wrote this:

$('.group>span').delegate ("hover", "a", function() {

While it should be in this order:

$('.group>span').delegate ("a", "hover", function() {

Anyway you can use delegate for hover this way :

$('.group>span').delegate("a", "mouseenter", function() {
    $(this).html('<a href="#new_list">Some button</a>');
});

$('.group>span').delegate("a", "mouseleave", function() {
    $(this).empty();
}​);

LIVE DEMO
You can see another way to go in this question:
Using delegate() with hover()?