How to destroy / Delete Active accordion using jquery

Question

How can we destroy active accordion with all the content is have in it.

I started with this function

function DesctroyThisAccordion() {
var active = jQuery("#accordion").accordion('option', 'active');
 jQuery("#accordion").accordion('option', 'active').remove('h3');
jQuery("#accordion").accordion('option', 'active').remove('div');
}

I am using jQuery UI plugin for accordion

I am trying to find the active accordion and delete its h3 and div content.

i works if i select the last in accordion

//jQuery("h3[class^='Title']:last").remove('h3');
//jQuery("div[class^='ui-accordion-content']:last").remove('div');

But i want it for active accordion

any help would be greatly appreciated.

Answer 1

Since i didn't find any help on this question. I found solution, which may be helpful for any who are in same need.

jQuery("h3[class^='Title'][aria-selected='true']").remove('h3');
jQuery("div[class^='ui-accordion-content'][style^='display: block;']").remove('div');

Answer 2

I used:

$("#myAccordion").accordion("destroy");    // Removes the accordion bits
$("#myAccordion").empty();                // Clears the contents

If you only empty the accordion container, it still retains accordion properties and will not be reusable as an accordion. Here's the destroy documentation.

Answer 3

How about

$("#accordion h3").remove();
$("#accordion-cost div").remove();

Removes all h3 and div elements inside accordion.