title: javascript replace div on each click
body: <p>The following works to replace a div with a new div...</p>
  
  <pre><code>&lt;div id = "div1" style="display:block" onclick = "replace()"&gt;&lt;img src="1.jpg" /&gt;&lt;/div&gt;
  
  &lt;div id = "div2" style="display:none"&gt;&lt;img src="2.jpg" /&gt;&lt;/div&gt;
  
  &lt;script type = "text/javascript"&gt;
  function replace() {
  document.getElementById("div1").style.display="none";
  document.getElementById("div2").style.display="block";
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>What I can't figure out is how to make this work so when you click <code>div2</code> it is replaced by <code>div3</code> and so on.</p>
  
  <p>In other words, I want to replace the div on each click more than just once. What's the best way to go about this? I'm a novice, so not sure if the above is a good start or not.</p>
  
  <p>Thanks!</p>