Multiple handlers on an element in JavaScript

If an element has several handlers for one event, then even if the bubbling stops, all of them will be executed. That is, stopPropagation prevents the event from progressing further, but all handlers will work on the current element. See example:

elem1.addEventListener('click', function() { console.log('green'); }); elem2.addEventListener('click', function(event) { console.log('blue - the first handler'); event.stopPropagation(); // stops the bubbling }); elem2.addEventListener('click', function() { console.log('blue - the second handler'); // still works }); elem3.addEventListener('click', function() { console.log('red'); });

You can check:

enru