Stop loading of images with javascript (lazyload)?

Question

I am trying to stop the loading of images with javascript on dom ready and then init the loading whenever i want, a so called lazy loading of images. Something like this:

Answer 1

$(document).ready(function () {
    var images = $('img');
    $.each(images, function() {
        $(this).attr('src', '');
    });
});

This won't work because jQuery is being called after the page has loaded at:

$(document).ready()

all this code would be doing is removing the src value after the image has already been called from the server.