.on не работает над динамическим html

Я создаю drag and drop. Когда происходит падение, я создаю новый html runtime и хочу связать его с событием, поэтому я использовал следующий .on

.on ( "event", "selector", function() { 

но он не работает. Вот fragment:

 $( "#wrap .dragImages" ).on( "click", "button.edit-new-modal", function() { var photoId = $(this).attr('data-username'); alert(photoId); }); 

.on работает до перетаскивания. Но послесловие ничего не происходит при нажатии кнопки «button.edit-new-modal» !! Что не так? Любое решение?

    пытаться :

     $(document.body).on( "click", "button.edit-new-modal", function() { var photoId = $(this).attr('data-username'); alert(photoId); }); 

    Эта

     $( "#wrap .dragImages" ).on( "click", "button.edit-new-modal", function() { 

    должно быть :

     $(document).on( "click", "button.edit-new-modal", function() { 

    Когда вы подключаете обработчики событий, они привязаны только к существующим элементам HTML.

    Когда вы вставляете динамический HTML, вы должны снова подключить эти обработчики.

    В вашем случае вы можете завершить настройку обработчика событий так:

      function wireUpHandlers() { $( "#wrap .dragImages" ).on( "click", "button.edit-new-modal", function() { var photoId = $(this).attr('data-username'); alert(photoId); }); } 

    Вызовите этот метод в документе document.ready, а затем снова вызовите этот метод, после того как вы добавили свой динамический HTML на страницу

    Это динамически сгенерированный HTML, поэтому он не будет работать. Попробуйте использовать нижеприведенный fragment кода

    $ (document) .on (“click”, “button.edit-new-modal”, function () {

      var photoId = $(this).attr('data-username'); alert(photoId); });