Need css code to close subcategories on click
 

I recently added a vertical accordion menu to my website but I'm having trouble trying to figure out how to close the headers on click. Here is the jquery code that should enable that function (but it doesn't):

[<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {

// Store variables

var accordion_head = $('.accordion > li > a'),
accordion_body = $('.accordion li > .sub-menu');

// Open the first tab on load

accordion_head.first().addClass('active').next().slideDown('normal');

// Click function

accordion_head.on('click', function(event) {

// Disable header links

event.preventDefault();

// Show and hide the tabs on click

if ($(this).attr('class') != 'active'){
accordion_body.slideUp('normal');
$(this).next().stop(true,true).slideToggle('normal');
accordion_head.removeClass('active');
$(this).addClass('active');
}

});

});]

I'm at a loss, Any advice would be appreciated!

Anybody? :confused:

Looks like you dont give enough info for anyone to help. Do you have a link to your site? All you've posted is the js. Where is the element that you're adding a class of active too? Where is the css associated with .active?