title: Changing an image with a click (JavaScript)
body: <p>So, I'm working on a project for a motion-graphics class, wherein they teach us no JavaScript but then have us make a webpage using JavaScript. We're told to use DreamWeaver, and that's worked okay for most things, but I'm having trouble with one function in particular-</p>
  
  <p>I want to be able to change an image multiple times when it is clicked. I've put the DW generated code below, basically I want sun.png to change to whitedwarf.png when clicked, and that works fine using the MM_swapImage() method. The rub is that I want to be able to click on the new whitedwarf.png and change it to a 3rd image (planet.png for the curious).</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;Untitled Document&lt;/title&gt;
  
  &lt;style type="text/css"&gt;
  body {
  margin-left: 100px;
  margin-top: 100px;
  background-image: url(Images/startile.gif);
  }
  &lt;/style&gt;
  &lt;script type="text/javascript"&gt;
  function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))&gt;0&amp;&amp;parent.frames.length) {
  d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&amp;&amp;d.all) x=d.all[n]; for (i=0;!x&amp;&amp;i&lt;d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&amp;&amp;d.layers&amp;&amp;i&lt;d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x &amp;&amp; d.getElementById) x=d.getElementById(n); return x;
  }
  
  function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i&lt;(a.length-2);i+=3)
     if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src;     x.src=a[i+2];}
  }
  &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;img src="Images/sun.png" width="500" height="500" id="Image1" onclick="MM_swapImage('Image1','','Images/whitedwarf.png',0)" /&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I've provided as much relevant info as I can, I have precisely no familiarity with JS, though I have programmed a good deal in Java, so I'm not completely illiterate.</p>