title: Make Accordion Close on second click JQUERY
body: <p>I have made JQUERY Accordions which work fine.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="accordion"&gt;
  
  &lt;div class="title"&gt;&lt;span&gt;Accordian 1&lt;/span&gt;&lt;/div&gt;
  &lt;div class="hide"&gt;
  
    &lt;p&gt;hidden content&lt;/p&gt;
  
  &lt;/div&gt;
  
  &lt;div class="title"&gt;&lt;span&gt;Accordian 2&lt;/span&gt;&lt;/div&gt;
  &lt;div class="hide"&gt;
  
    &lt;p&gt;hidden content&lt;/p&gt;
  
  &lt;/div&gt;
  
  
  &lt;div class="title"&gt;&lt;span&gt;Accordian 3&lt;/span&gt;&lt;/div&gt;
  &lt;div class="hide"&gt;
  
     &lt;p&gt;hidden content&lt;/p&gt;
  
  &lt;/div&gt;
  
  &lt;div class="title"&gt;&lt;span&gt;Close all the accordions&lt;/span&gt;&lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>JQUERY </p>
  
  <pre><code>$(document).ready(function() {
  
      $('#accordion .hide').hide();
     $('#accordion .title span').click(function(){
             $('#accordion .hide').slideUp();
             $(this).parent().next().slideDown();
  
             return false;
     });
  </code></pre>
  
  <p>});</p>
  
  <p>What I would like is when a user clicks an accordion to open it, and then clicks it a second  time that it would close.</p>
  
  <p>So 1st click  = open, 2 click = close.</p>
  
  <p>How would I go about this?</p>
  
  <p>Thanks</p>