title: jQuery add remove class onclick to a div
body: <p>I have created the code below, which successfully rotates an arrow, via the class rotate, on the first click.</p>
  
  <p>But on the second click, i want the arrow to rotate back again. I have tried, using an else, and removing class on click. But this hasn't worked. Any suggestions, or help, would be great! </p>
  
  <pre><code> $(document).ready(function(){
          $('#first').click(function(event) {
            $(".content.firstArrow").addClass("rotate");
          }); 
          $('#second').click(function(event) {
            $(".content.secondArrow").addClass("rotate");
          }); 
          $('#third').click(function(event) {
            $(".content.thirdArrow").addClass("rotate");
          }); 
          $('#forth').click(function(event) {
            $(".content.forthArrow").addClass("rotate");
          });       
     });
  </code></pre>