Question

I’m using jQuery’s .on() function to attach some behavior on the click event on an object, say a span.

My setup looks something like this:

$('#container').on('click', 'span', function() {
    // do stuff
});

Inside this function, this is span. How do I get #container?

---

Full example: http://jsfiddle.net/aymansafadi/Nk3p9/

<div id="container">
    <span>Click Me!</span>
</div>​

—

$('#container').on('click', 'span', function() {

    var span = $(this),
        div  = false; // This is what I need

    console.log(span);
});​

Answer 1

Use event.delegateTarget

$('#container').on('click', 'span', function(e) {

    var span = $(this),
    div  = e.delegateTarget;

    console.log(div);
});

DEMO