Doesn't load after dynamically inserted images

Some browsers (including Safari for iOS) doesn’t recognize WebP image format. So, i want to use Modernizr lib to detect if i will deliver PNG/JPG or WebP.

The code to insert the new data-src works, but i want to use it with LOZAD, but, it doesn’t load that images dynamically inserted.

// * Lozad
const observer = lozad();
observer.observe();

// * jQuery
$(function() {

    // * Modernizr
    Modernizr.on('webp', function (result) {
        if(result) {
            $("img").each(function() {
                imgDelivery = $(this).data("webp");
                $(this).attr("data-src", imgDelivery);
            }); 
        }
        else {
            $("img").each(function() {
                imgDelivery = $(this).data("original");
                $(this).attr("data-src", imgDelivery);
            });
        }
        observer.observe(); // * Doesnt load the new images inserted above
    });
});

Tested on: Chrome, Safari for osx 12.0.02, Opera, Safari for iOS

[shivbabbar]

   jQuery("img").each(function(i, elm) {
        imgDeliverySrc = jQuery(this).attr("src");
        jQuery(this).attr("data-src", imgDeliverySrc);
        jQuery(this).addClass("lozad");
        jQuery(this).removeAttr("src");
   }).promise().done( function(){

    //alert("All was done");

    my_custom_run_lozad();

   });  // each loop completed




function my_custom_run_lozad()
{
    const observer = lozad();
    observer.observe();



    lozad('.lozad', {
        load: function(el) {
            console.log('loading IMAGE');
            // Custom implementation to load an element
            // e.g. el.src = el.getAttribute('data-src');
        }
    });
}

In this code, I run the lozad after attach data-src to each image after completed the jquery each Working fine for me.

[chesio]

Just a blind guess: add the lozad class dynamically (= when you set data-src attribute).

Based from presence of data-loaded attribute, I guess that Lozad marks the image as loaded (even if there is no src and thus there’s nothing to load) and does not load the image after you add data-src to it.