jQuery .on(‘click’) vs. .click() and .delegate(‘click’)

Both modes are still supported.

The following call to bind():

$(".foo").bind("click", function() {
    // ...
});

Can be directly converted into the following call to on():

$(".foo").on("click", function() {
    // ...
});

And the following call to delegate():

$("#ancestor").delegate(".foo", "click", function() {
    // ...
});

Can be converted into the following call to on():

$("#ancestor").on("click", ".foo", function() {
    // ...
});

For completeness, the following call to live():

$(".foo").live("click", function() {
    // ...
});

Can be converted into the following call to on():

$(document).on("click", ".foo", function() {
    // ...
});

UPDATE:

Except on event, the rest of the events were deprecated in different jQuery versions.

  • bind – version deprecated: 3.0
  • live – version deprecated: 1.7, removed: 1.9
  • delegate – version deprecated: 3.0

Leave a Comment