jQuery check if image is loaded

Question

I need help with the following code which doesn't work:

var timeoutID=0;
var currentImage=0;//first image is position 0 in arrImages array
var arrImages=[bla bla bla array of image URLs];
function slideShow()
{
   if($('#myImg').complete)//   <------- Here is where it fails as that's UNDEFINED.
   {
      //curentImage is a global var that remebembers the on-screen image array key
      var nextImage=currentImage+1;

      //arrImages is the array of image URLs
      if(nextImage>=arrImages.length){nextImage=0;}

      $('#myImg').attr('src',nextImage);

      clearTimeout(timeoutID);
      //Change image each second after previous image was loaded
      timeoutID=setTimeout("slideShow()",1000);
   }
   else
   {
      $('#myImg').load(slideShow);
   }
}

Basically I want to change the src for #myImg each second, provided that the counter starts after the image loaded.

*I hate the code button in the text editor for Stack Overflow!

Answer 1

'complete' is for native javascript object. so you should get javascript object from jQuery. like,

$('#myImg')[0].complete

or

$('#myImg').get(0).complete