Reputation: 1678
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
Reputation: 111
Try this:
$( "#indexHero" ).click(function(){
if($("#tabNo1").hasClass("active"))
{
$( "#testID1, #testID2" ).addClass( "hideMe" );
$( "#testID3" ).removeClass( "hideMe" );
}
});
Upvotes: 1
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
Reputation: 32354
use hasClass()
$( "#indexHero" ).click(function(){
if ($('#tabNo1').hasClass('active')) {
$( "#testID1, #testID2" ).addClass( "hideMe" );
//} else {
$( "#testID3" ).removeClass( "hideMe" );
}
}):
Upvotes: 3