jQuery .on() delegated mouseenter and mouseleave [duplicate]

Question

What's the best way to delegate multiple events using .on()?

This is the syntax for one delegated event:

$(document).on('mouseeenter','.foo', function(){});

And here is the syntax for multiple events (not delegated):

$('.foo').on({
    mouseenter: function(){
        //stuff
    },
    mouseleave: function(){
        //stuff
    }
});

I was wondering if there was a more succinct way to do this other then:

$(document).on('mouseenter', '.foo', function(){})
           .on('mouseleave', '.foo', function(){});

It's not a big deal if I have to do it that way, I'm more curious about it than anything.

Answer 1

$(document).on({
    mouseenter: function(){
        //stuff
    },
    mouseleave: function(){
        //stuff
    }
}, '.foo');