How to implement expand/collapse all button on page with accordions?

How to implement expand/collapse all button on page with accordions?

I have a page with a number of accordions. I have been asked to also provide an Expand All/Collapse All button. The problem is that if the user opens and closes a few accordions and then decides to Expand All, those accordions that had previously been opened now become closed. This can be see on my dev page

To replicate:
click on accordion 1.00
click on accordion 1.10.00 
Click Expand All
Notice that accordion 1.10.00 did not expand 

This is my javascript for the Expand/Collapse All button:
  1. // Start Accordian Script for Open/Close All
    
        $(document).on('click', '.expandcollapse', function () {
    		
    		
    		
            if ($(this).html() == 'Expand All' || $(this).html() == '<i class=\"glyphicon glyphicon-plus\"></i> Expand All') {
                $('.panel-collapse.collapse:not(.in)').each(function (index) {
                   
    				
    				$(this).collapse('show');
    				$('#print').show();
    				$(this).attr('data-toggle', '');
    			
                });
                $(this).html('<i class=\"glyphicon glyphicon-minus\"></i> Collapse All');
            }
            else {
                $('.panel-collapse.collapse.in').each(function (index) {
                    $(this).collapse('hide');
    				$('#print').hide();
    				$(this).attr('data-toggle', 'collapse');
    			});
                $(this).html('<i class=\"glyphicon glyphicon-plus\"></i> Expand All');
            };
        });
    
        // End Accordian Script for Open/Close All