I am using Jquery reveal to show hide div with anchor tag i am trying to add class ('active') to a tag when i click on it to show hidden div then there should be 'active' class appear like Open/Close i have used .addClass('active') it work but when i again click on anchor the class="active" doesn't disappear.

here is my code :

<script type="text/javascript">  
    $(document).ready(function(){

        $(".slide_div").hide();
        $(".show_hide").show().addClass('active');

        $('.show_hide').click(function(){        
            $(".slide_div").slideToggle();
        });

    });
</script>

<a class="show_hide" href="#">Open/Close</a>
<div class="slide_div"></div>

I am using Jquery reveal to show hide div with anchor tag i am trying to add class ('active') to a tag when i click on it to show hidden div then there should be 'active' class appear like Open/Close i have used .addClass('active') it work but when i again click on anchor the class="active" doesn't disappear.

here is my code :

<script type="text/javascript">  
    $(document).ready(function(){

        $(".slide_div").hide();
        $(".show_hide").show().addClass('active');

        $('.show_hide').click(function(){        
            $(".slide_div").slideToggle();
        });

    });
</script>

<a class="show_hide" href="#">Open/Close</a>
<div class="slide_div"></div>

• javascript
• jquery
• css

2 Answers 2

Use $(".show_hide").toggleClass('active');

$('.show_hide').click(function(){
    $(this).toggleClass('active');
    $(".slide_div").slideToggle();
});

Demo: Fiddle

Use toggleClass("active") instead of addClass('active')

http://api.jquery./toggleClass/