title: how do i change image src onclick with jquery, Sound/Mute buttons
body: <p>Hey guys i really need some help with this!
  So i need to change an image when you click on it to another one. Essentially its a sound button so when its clicked it shows mute.</p>
  
  <p>So far I'm completely baffled and have no idea where to start i know i can use Jquery/Javascript. Please help me!! here is my code:</p>
  
  <pre><code>    &lt;div id= "Mute"&gt;
      &lt;img class="BeforeClick"src="images/BeforeClickMute.png" width="140" height="126"/&gt;
      &lt;img class="AfterClick"src="images/AfterClickMute.png" width="140" height="126" /&gt;
      &lt;p&gt;Mute&lt;/p&gt;
      &lt;/div&gt;     
  </code></pre>
  
  <p>also this is my css code</p>
  
  <pre><code>    .BeforeClick {
  position:absolute;
  z-index:9;
  left:245px;
  top:340px;  
  }
  
      .AfterClick {
  position:absolute;
  z-index:8;
  left:245px;
  top:340px;  
  }
  </code></pre>