Question

I have a scrollable div element with a number of checkboxes dynamically generated. I need to fire an event every time a different selection is made. i.e. a different set of checkboxes is selected.
I couldn’t find any onchange() handler for the tag. What event of the div can I use to handle this functionality?

Answer 1

A <div /> element itself does not have a change event; but the change event for the inputs will bubble up through their ancestors; so you can still listen for the event on the <div />

$('div').on('change', function (e) {
    // in here, `this` is the div element and e.target is the changed checkbox
});

The more jQuery-esque way however, will be to delegate the handler to the <div /> element as follows;

$('div').on('change', 'input:checkbox', function (e) {
    // in here, `this` is the checkbox and `e.delegateTarget` is the div.
});

For more info, see the jQuery documentation for on(). More information on event bubbling can be found here^{my blog}.