title: Rotate Image Icon On Click
body: <p>Was wondering if someone can help me with this. I want to be able to click the text/icon, and on click, the + icon rotates 45 degrees to look like a x icon. Upon second click, the icon rotates back to look like a + icon, and so on.</p>
  
  <p>Any help will be greatly appreciated!</p>
  
  <p><strong>JSFIDDLE</strong></p>
  
  <p><a href="https://jsfiddle.net/d264kt2t/" rel="nofollow">https://jsfiddle.net/d264kt2t/</a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="container"&gt;
  
  &lt;div class="pointer"&gt;
  CLICK ME&lt;img src="http://www.ssglobalsupply.com/images/plus.png" class="coolImage"&gt;
  &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.container{
    width:100%;
    padding-top:100px;
    padding-bottom:100px;
    background-color:#000;
  
  }
  
  .coolImage{
    height:17px;
    width:17px;
    margin-left:7px;
  }
  
  .pointer{
    cursor:pointer;
    text-align:center;
    font-size:20px;
    color:#fff;
  }
  </code></pre>