.он() должным образом не работает с динамическим контентом

Question

У меня есть простой скрипт, который Js получает фоны из следующих элементов:

<ul class="vk_image_grid"> 
 
    \t \t <li style="background-image: url(https://name.com/image1.jpg)" class="block"> 
 
    \t \t </li> 
 
    \t \t <li style="background-image: url(https://name.com/image2.jpg)" class="block"> 
 
    \t \t </li> 
 
    \t \t <li style="background-image: url(https://name.com/image3.jpg)" class="block"> 
 
    \t \t </li> 
 
    \t </ul> 
 
<script> 
 
\t $("ul li").on("click", function() { 
 
\t \t var bg = $(this).css('background-image'); 
 
\t \t alert(bg); 
 
</script>

Он прекрасно работает с двумя первыми li, которые генерируются по php. Но он не показывает фон третьего li, который сгенерирован другим сценарием jQuery. Как я могу исправить проблему?

Answer 1

Третий элемент li, кажется, сгенерирован после запуска $("ul li"). Поэтому обработчик события не будет прикреплен к третьему элементу li.

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

Для более точного уточнения вам необходимо предоставить более подробную информацию о вашем коде.