Setting up an accordion on HTML pages with auto-open on hash, auto open first accordion, and sending an event to Google Analytics on header click.

accordion.html

<div id="accordion">

<div class="accordionheader">
<!-- Use Font Awesome for rotating arrows (i class) - https://fortawesome.github.io/Font-Awesome -->
<h4><a id="test" href="#test"></a>Test Header<i class="fa fa-angle-down"></i></h4>
</div>

<div class="accordionbody">
<p>Test body.</p>
</div>

</div>

accordion.js

<script>
/* Basic Accordion */
$( "#accordion" ).accordion({
      heightStyle: "content",
      active:false,
      collapsible: true,
      header:"div.accordionheader"
    })
/* Open First Accordion Automatically. Update 0 to cooresponding number */
    $("#accordion").accordion("option", "active", 0);
/* Accordion will open based on URL's hash */    
    var hash = window.location.hash;
    var anchor = $('a[href$="'+hash+'"]');
    if (anchor.length > 0){
        anchor.click();
    }
/* On Click of Accordion Header Send H4 text as an event to Google Analytics */
    $('h4').click(function() {
	var linkText = $(this).text();
	ga('send', 'event',  'accordion', 'click', linkText);
});
</script>