title: jQuery UI accordion - expand all
body: <p>I'm using below example code from Jquery website:
  <a href="http://jqueryui.com/accordion/#collapsible" rel="nofollow">http://jqueryui.com/accordion/#collapsible</a></p>
  
  <pre><code>&lt;script&gt;
  $(function() {
  $( "#accordion" ).accordion({
  collapsible: true
  });
  });
  &lt;/script&gt;
  &lt;div id="accordion"&gt;
    &lt;h3&gt;Section 1&lt;/h3&gt;
    &lt;div&gt; content 1 &lt;/div&gt;
    &lt;h3&gt;Section 2&lt;/h3&gt;
    &lt;div&gt; content 2 &lt;/div&gt;
    &lt;h3&gt;Section 3&lt;/h3&gt;
    &lt;div&gt; content 3 &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But now I need to add two buttons: one to "Collapse All" and another one to "Expand All".</p>
  
  <p>Do you have any suggestions on how to achieve this?</p>