Jay
Jay

Reputation: 1678

jQuery if element has class do something

I'm trying to toggle whether tabs will be displayed based on whether or not the matched list item has a class of active. I've tried multiple different approaches with if statements and .hasClass but cannot get it to behave as I wish! Any help would be greatly appreciated.

This is an example of one of my attempts:

$( "#indexHero" ).onClick(function(){
  $("#tabNo1.active"){
    $( "#testID1, #testID2" ).addClass( "hideMe" );
    $( "#testID3" ).removeClass( "hideMe" );
  }
});

Upvotes: 3

Views: 17897

Answers (3)

Vasilev
Vasilev

Reputation: 111

Try this:

$( "#indexHero" ).click(function(){
   if($("#tabNo1").hasClass("active"))
   {
      $( "#testID1, #testID2" ).addClass( "hideMe" );
      $( "#testID3" ).removeClass( "hideMe" );
   }
});

Upvotes: 1

Sudharsan S
Sudharsan S

Reputation: 15393

Check with length property or else Use .hasClass() in jquery

$( "#indexHero" ).click(function(){
 if($("#tabNo1.active").length > 0){
   $( "#testID1, #testID2" ).addClass( "hideMe" );
   $( "#testID3" ).removeClass( "hideMe" );
 }
});

or

if($("#tabNo1").hasClass("active")){

}

Upvotes: 5

madalinivascu
madalinivascu

Reputation: 32354

use hasClass()

   $( "#indexHero" ).click(function(){
      if ($('#tabNo1').hasClass('active')) {
        $( "#testID1, #testID2" ).addClass( "hideMe" );
        //} else {
        $( "#testID3" ).removeClass( "hideMe" );
       }
      }):

Upvotes: 3

Related Questions