Getting images to change in a for loop in javascript
<p>So far I created an array with 11 images, initialized the counter, created a function, created a for loop but here is where I get lost. I looked at examples and tutorial on the internet and I can see the code is seeming simple but I'm not getting something basic here. I don't actually understand how to call the index for the images. Any suggestions. Here is the code.</p>

<pre><code> &lt;script type="text/javascript"&gt;
 var hammer=new Array("jackhammer0.gif",
                "jackhammer1.gif",
                "jackhammer2.gif",
                "jackhammer3.gif",
                "jackhammer4.gif",
                "jackhammer5.gif",
                "jackhammer6.gif",
                "jackhammer7.gif",
                "jackhammer8.gif",
                "jackhammer9.gif",
                "jackhammer10.gif")
 var curHammer=0;

 var numImg = 11;
 function getHammer() {

   for (i = 0; i &lt; hammer.length; i++)
   {
     if (curHammer &lt; hammer.length - 1) {
       curHammer = curHammer +1;
       hammer[i] = new Image();
       hammer[i].src="poses/jackhammer" +(i+1) + ".gif";

       var nextHammer = curHammer + 1;
       nextHammer=0;
       {
       }
     }
   }
 }


 setTimeout("getHammer()", 5000);

 &lt;/script&gt;
&lt;/head&gt;
 &lt;body onload = "getHammer()";&gt;
 &lt;img id="jack" name="jack" src = "poses/jackhammer0.gif" width= "100" height ="113" alt =   "Man      and Jackhammer" /&gt;&lt;br/&gt;
 &lt;button id="jack" name="jack" onclick="getHammer()"&gt;Press button&lt;/button&gt;
</code></pre>
