Accordion using jQuery

<div id="accordion">

  <h3 class="title">First header</h3>

  <div class="content">First content panel</div>

  <h3 class="title">Second header</h3>

  <div class="content">Second content panel</div>

</div>

<style>

.content{display:none;}

</style>

//Type One

<script>

jQuery('#accordion .title').each(function(){

jQuery(this).addClass('active');

jQuery(this).toggle(function(){

jQuery(this).addClass('active').next().slideDown(200);

},function(){

jQuery(this).removeClass('active').next().slideUp(200);

})

}); 

</script>

//Type Two

<script>

a = jQuery('.footer-menu').find('#accordion .title');

console.log(a.hasClass('active'));

jQuery('#accordion .title').click(function(e){ 

e.preventDefault();

speed = 300;

if(jQuery(this).hasClass('active') === true) {

} else if(a.hasClass('active') === false) {

jQuery(this).addClass('active').next('.content').slideDown(speed);

} else {

a.removeClass('active').next('.content').slideUp(speed);

jQuery(this).addClass('active').next('.content').delay(speed).slideDown(speed);

}

});

</script>

Close a div popup after clicking outside it

Remember that jQuery library must be included.

Use following js code

jQuery(document).mouseup(function (event){
    var divcontainer = jQuery(".forclose" ); // Object of DIV
    if (divcontainer.has(event.target).length === 0){
        divcontainer.hide();
    }
});