How to do load() on ajax loaded images?

want to do nice image loading, but my images are loaded by ajax (prepend). How to do load() on each image. I want it to load one by one, order doesn't matter. Before image load I want some loading gif.

Here is what I tried:

.done(function( data ) {
        var obj = JSON.parse(data);
        for(i = 0; i < obj.length; i++)
            if(obj[i].indexOf("blank.gif") > -1)
                continue;
            else
                $("#images_for_this_gallery").prepend("<div id='fd_" + i + "' class='featured_image_div'>" +
                "<span class='imageloading'>loading</span>"    + //LOADING MEESAGE FOR EACH IMAGE
                "<img class='images' src='" + image_path +  obj[i] + "' />" + // IMAGE FOR NICE LOAD
                "<a href='#' id='" + obj[i] + "' class='image_delete'>X</a>" +
                "</div>").hide();
    });

And here is my attempt:

$(".images").each(function() {
        if (this.complete) {
            // this image already loaded
            // do whatever you would do when it was loaded
        } else {
            $(this).load(function() {
                $(".imageloading").hide();
                $(this).show();
            });
        }
    });

Here is another attempt:

$(function() {
        $(".images").load(function(){
            $(".imageloading").hide();
            $(".images").show();
        });
    });

It works on normal image but not on ajax generated image...

Thank you!