load() function for loading images

load() function for loading images

I just read this tutorial on dynamically loading images using jQuery:
http://www.chazzuka.com/blog/?p=87

However, there is one thing I dont quite understand.  The .load() function is binded to a new img() which is empty.  The src of the image is only added to the img object AFTER the load().  So wouldn't the load() function be loading an empty img() object rather than loading the image declared in the src after?

  1. var img = new Image();

    $(img).load(function () {
          $(this).css('display','none');

          $(el).removeClass('loading').append(this);
          $(this).fadeIn();
    }).error(function () {
          $(el).remove();
    }).attr('src', images[index]);