jQuery каждый метод для автозапуска динамических элементов

Question

$('body').on('click', function () {
  $( '.detailTextContainer a' ).each(function() {
    var urlFoto = $(this).attr('href');
    var imgElement = $("<img />").attr('src', urlFoto)
                                 .addClass('dalsiFoto');

    $(this).empty().append( imgElement );   
  });
});

Как я могу запустить эту функцию автоматически после загрузки страницы (без события). '.detailTextContainer a' являются динамическими элементами, которые загружаются на страницу сразу после начальной страницы.

Я попробовал этот код:

function showImage (){
  $( '.detailFeatureDesc a' ).each(function() {
    var urlFoto = $(this).attr('href');
    var imgElement = $("<img />").attr('src', urlFoto)
                                 .addClass('dalsiFoto');
    $(this).empty().append( imgElement );
  });
};

showImage();

Но это не было успешно.

Спасибо

Answer 1

Вы можете примерить слушателя

$(document).on("click", ".detailTextContainer a", function() {
  // your code
});

Answer 2

Вы можете использовать функцию загрузки:

$( window ).load(function() {

      // create detailTextContainer here
      $( '.detailTextContainer a' ).each(function() {
             var urlFoto = $(this).attr('href');
             var imgElement = $("<img />").attr('src', urlFoto)
                                          .addClass('dalsiFoto');

        $(this).empty().append( imgElement );   

      });

});

Из документации это запустит функцию, когда страница полностью загружена, включая графику.

Или вы можете использовать:

$( document ).ready(function() {

});

или стенография:

$(function() {

});

Это будет выполнено только после того, как объектная модель документа (DOM) страницы будет готова для выполнения кода JavaScript.

Answer 3

Вы должны просто написать функцию на функцию загрузки окна

<script>
$( document ).ready(function() {
    console.log( "document loaded" );
});

$( window ).on( "load", function() {
   //write your code is given section
});
</script>