title: Javascript changing an image within a div after a certain amount of time
body: <p>I am currently making a web page with an image inside of a div tag. I wrote a script to change the image after a certain amount of time, and it works fine when I test the script alone, however; when I attempt to place the script within my web page, it does not change the image.</p>
  
  <p>Here is the code for my script:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;body&gt;
          &lt;script&gt;
              images = new Array;
              images[0] = "img2.gif";
              images[1] = "img3.gif";
              images[2] = "img4.gif";
              images[3] = "img5.gif";
              images[4] = "img6.gif";
              images[5] = "img7.gif";
              images[6] = "img8.gif";
              images[7] = "img9.gif";
              images[8] = "img10.gif";
  
              setInterval( function() {
                  changeImage()
              }, 5000);
  
              x = 0;
  
              function changeImage() {
                  document.getElementById('ad').src = images[x];
  
                  if ( x &lt; 8 ) {
                      x += 1;
                  } else if ( x = 9 ) {
                      x = 0;
                  }
              }
          &lt;/script&gt;
  
          &lt;img id='ad' src="img.gif"&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I have tested this script with the image inside of a div tag and it still works fine. When I put the same code into my web page, it does not work. Also note, the image file names are just examples. The images I am using are from photobucket, so I have very little control over what they are called. Any help I could get on this would be greatly appreciated.</p>