jQuery toggleClass with conditional

Question

Does anyone know how to write the following in a neater, one line format? I'm sure it's possible but can't get very far with it.

if($('#myDiv').hasClass('hidden')){
   $('#myDiv').toggleClass('shown hidden');
}

Basically to only perform a toggle in one direction.

Many thanks,

Tom.

var result = $("#myDiv").hasClass("hidden") ? $('#myDiv').toggleClass('shown hidden') : false — Jagz S
– Jagz S, Commented Jun 15, 2012 at 11:45

Mukesh Soni · Accepted Answer · 2012-06-15 11:45:12Z

14

$('#myDiv.hidden').toggleClass('shown hidden');

answered Jun 15, 2012 at 11:45

Mukesh Soni

6,6683 gold badges34 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user234932 Over a year ago

@FelixKling: The selector guarantees that hidden is set, I think.

Felix Kling Over a year ago

My apologies... (deleted my comment).

Tom Millard Over a year ago

I knew it was going to be something stupidly simple. Thanks so much for the help everyone.

Richard Neil Ilagan · Accepted Answer · 2012-06-15 11:45:35Z

0

Maybe you can just call $('#myDiv').removeClass('hidden').addClass('shown') (and the corresponding inverse). It'll remove .hidden if it's there, and add .shown if it doesn't have it yet.

answered Jun 15, 2012 at 11:45

Richard Neil Ilagan

14.8k6 gold badges52 silver badges68 bronze badges

2 Comments

Richard Neil Ilagan Over a year ago

I take it that the idea is that the two classes shouldn't be assigned at the same time, and no other logic is dependent on the conditional. If the OP wants it in one line, it's a valid assumption. Don't know why, but hey.

Aamir Afridi Over a year ago

.toggle is much simpler

Collectives™ on Stack Overflow

jQuery toggleClass with conditional

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related