jQuery .on() method doesn't see new elements

Question

I\'m getting a JSON element and building a list from its items like this:

getTitles: function(data) {
    data = data || {};
    var list = [];

    $.getJSO         


        

Answer 1

You want to use event delegation to capture events triggered on events that are present in the DOM at any point in time:

$().on('click', 'a', function(e) {
    alert('clicked');
    e.preventDefault();
});

UPDATE - In this example the is an ancestor of the links to which you are binding that is present in the DOM at the time of binding.

The basic idea is that since we can't attach an event handler to a DOM element not yet in the DOM, we attach the event handler to an ancestor element and wait for the event to bubble up to the ancestor element. Once the event reaches the ancestor event the event.target property is checked to see what was the originally clicked element.