title: Changing color of image with onclick function not working?
body: <p>I'm trying to give variable color a value of either green or red, and from there give imagePath a specific src depending on the value given to color.</p>
  
  <p>From there I can switch the shirt image continuously between red and green by pressing either buttons.</p>
  
  <p>What actually happens is that the shirt color changes to red. After which, it doesn't change to green even if I press the green button activating the <code>green()</code> function.</p>
  
  <pre><code>My HTML code:
  
  &lt;html&gt;
  &lt;head&gt;
      &lt;script src="oands.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
      var color;
      function red(){color = "red"; change()}
      function green(){color = "green"; change()}
  
      function change()
      {
           if(color = "red")
           {
               imagePath = 'images/red-t-shirt.png';
            }
           if(color = "green")
           {
               imagePath = 'images/green-t-shirt.png';
           }
          O("shirt").src = imagePath;
      }
      &lt;/script&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div id="wrapper"&gt;
          &lt;div id="content"&gt;
              &lt;img id="shirt" name="shirt" src="images/white-t-shirt.png"&gt;
              &lt;div class="smallbox" id="redBox" onclick="red()"&gt;
                  red
              &lt;/div&gt;
  
              &lt;div class="smallbox" id="greenBox" onclick="green()"&gt;
                  green
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The code in <code>oands.js</code> :</p>
  
  <pre><code>function O(obj)
  {
      if (typeof obj == 'object') 
      return obj;
  
          else 
      return document.getElementById(obj) 
  }
  </code></pre>