JavaScript JavaScript and the DOM Responding to User Interaction Listening for Events with addEventListener()

What's the difference between .addEventListener() and .on()?

I tried looking this up but only found answers for .addEventListener() vs .onclick() / .onchange() etc, but I'm wondering about .on()

In my eyes they do exactly the same thing, but I'm still learning! What's the difference between the two, when would I use one over the other?

1 Answer

Steven Parker
Steven Parker
186,663 Points

One is normal JavaScript, the other is jQuery.

Specifically, .addEventListener() is a method of a normal DOM element and .on() is a jQuery object method. As you probably know, a jQuery object can represent more than one element and when you use the .on() method you are attaching and event handler to every element in the collection.

So essentially, they work with different kinds, and potentially quantities, of things.

Ahh, makes complete sense. Thank you!