PrismitaLEARN · PRACTICE · GROW

What is the difference between .bind(), .live(), .delegate() and .on() in jQuery?

jQuery Events Intermediate 1–2 Yrs2–3 Yrs Conceptual 1 min read

Quick Answer

.on() (jQuery 1.7+) replaced them all. .bind() — direct binding to current elements. .live() — delegated to document (deprecated, slow). .delegate() — delegated to a chosen ancestor. .on(event, selector, handler) — the modern unified form: with a selector it's delegated, without it's direct.

These are all the same feature at different points in jQuery's history. .bind was direct binding, .live delegated everything to the document and was slow, .delegate let you pick the ancestor to delegate to. Since jQuery 1.7 they're all just .on(): if you pass a selector as the second argument you get delegation, if you don't it's a direct binding. So modern jQuery code only ever uses .on and .off.

  • Use $(parent).on('click', '.child', fn) for delegation — handles dynamically added .child elements.
  • Use $('.el').on('click', fn) for a fixed element.
  • .off() unbinds; namespaced events (.on('click.myPlugin')) let you remove just your handlers.
All jQuery questions More on Events