jQuery 'on' не привязывающее событие к элементу

Question

У меня есть следующая функция, которая вызывается немедленно и связывает событие click с элементами.

(function (window, $, undefined) { 
    var methods  = {}, 
    selector = $('.selector'); 

    methods.init = function() { 
     selector.find('> .section').on('click', function (e) { 
      alert('hey'); 
     } 
    } 

    if (selector.length > 0) { 
     methods.init(); 
    } 

}(window, jQuery)); 

мне нужно, чтобы это также связывать элементы, которые были добавлены динамически, так что я изменил к этому:

var modules = modules || {}; 
modules.stuff = (function (window, $, undefined) { 
    var methods  = {}, 
    selector = $('.selector'); 

    methods.init = function() { 
     selector.find('> .section').on('click', function (e) { 
      alert('hey'); 
     } 
    } 

    if (selector.length > 0) { 
     methods.init(); 
    } 


    return methods; 

}(window, jQuery)); 

А потом добавил динамические элементы, то называется modules.stuff.init(); я могу видеть, что функция инициализации является но события щелчка не срабатывают?

Answer 1

Вам необходимо использовать делегированную подпись метода on(). Попробуйте следующее:

methods.init = function() { 
    selector.on('click', '> .section', function (e) { 
     alert('hey'); 
    } 
}