Adding or removing panels

Prior to Version 1.10, the only way you could change the number of panels in an accordion was to destroy it and reinitialize a new instance. While this worked, it was not a satisfactory way to implement any changes, with this in mind the jQuery team have worked hard to introduce a new method, which brings it in line with other widgets, which don't require recreating in order to change any configured options. Let's test this method using an input button, to create our new panels.

In accordion13.html, change the markup immediately below the accordion to the following code:

<p>
 <button type="button" id="addAccordion">Add Accordion</button>
</p>

Alter the <script> block, so it appears as follows:

<script>
  $(document).ready(function($) {
    $("#myAccordion").accordion();
    $('#addAccordion').click( function() {
      var newDiv = "<h2><a ref='#'>New Header</a></h2><div>New Content</div>";
    ...