title: Replace image with another image, then replace again after timeout - Javascript
body: <p>I'm trying to do the following:</p>
  
  <p>onClick, replace image1 with image2, then after 5 seconds, replace image 2 with image 1 again.</p>
  
  <p>Image 1 is replaced with image 2, but my problem is that it doesn't revert back after the timeout.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>&lt;img id="loadimg" style="display:none;" src="images/Loader.gif" width="140" height="30" /&gt;
  
  &lt;script type="text/javascript" language="javascript"&gt;
  
  function showLoad(){
      document.getElementById('Generate1').src=document.getElementById('loadimg').src;
      setTimeout(showCode(), 5000);
  }
  
  function showCode(){
      document.getElementById('loadimg').src=document.getElementById('Generate1').src;
  }
  
  &lt;/script&gt;
  
   &lt;td colspan="3" rowspan="3"&gt;&lt;img src="images/BUTTON.gif" alt="" name="Generate1" width="168" height="40" id="Generate1" onClick="showLoad()"&gt;&lt;/td&gt;
  </code></pre>
  
  <p>Thanks for any help.</p>