jQuery delegated event binding not working?

Question

I am using jQuery 2.2.4. I have three .note_edit elements in my page, added dynamically after page load (they are part of CartoDB infowindows).

I am using the following code in the console to check that the elements exist, which they do:

$("body .note_edit");

Then I am trying to add a dynamic event in the console as follows:

$('body').on('click', '.note_edit', function(e) { e.preventDefault(); console.log('whatever'); });

But when I click on the elements, nothing happens - no console output.

What might be going wrong here? There aren't any other JS errors in the console, the elements definitely exist... what could it be?

Answer 1

Check for other events bound to the elements. Can I find events bound on an element with jQuery?

I suspect there is a e.stopPropagation() preventing body from being reached.