When I try to use a single button to toggle all accordion-elements, some of which are already open, the toggle functionality acts strangely.
If I use this code snippet:
$('.corearea-wrapper .corearea-link').click(function(e) {
e.preventDefault();
mywrapper = $('.corearea-wrapper #' + $(this).parent().children('.row.fixedcol').attr('id'));
if(mywrapper.hasClass('allopen')) {
mywrapper.find('.collapse').collapse('hide');
mywrapper.find('article').removeClass('active');
mywrapper.removeClass('allopen');
} else {
mywrapper.find('.collapse').collapse('show');
mywrapper.find('article').addClass('active');
mywrapper.addClass('allopen');
}
});
My intended outcome is: on the first click, close all open elements; on the second click, open all elements; on the third click, close all again, and so forth.
However, what actually occurs is: on the first click, open elements close but closed ones open; on the second click, all open elements close; on the third click, all elements open, and subsequent clicks repeat this pattern.
View the demo here: