how to change css class with toggleClass for specific class detected

Question

I have some divs with same .hour_slots_available named class. and also contained some disabled divs with .hour_slots_disabled named class which are change with response from database.

Now I want to change these .hour_slots_available divs with .slot_activated class when I click.

But when I click these .hour_slots_available divs then its changed with .slot_activated but also changed those disabled divs with selected divs

Here is html code

<li><div id="12_01" class="hour_slots_available" ><span class="hour_tag">12:00 - 01:00</span></div></li>
<li><div class="hour_slots_available" id="01_02"><span class="hour_tag">01:00 - 02:00</span></div></li>
<li><div class="hour_slots_available" id="02_03"><span class="hour_tag">02:00 - 03:00</span></div></li>
<li><div class="hour_slots_available" id="03_04"><span class="hour_tag">03:00 - 04:00</span></div></li>
<li><div class="hour_slots_available" id="04_05"><span class="hour_tag">04:00 - 05:00</span></div></li>

and here is my jquery code

$(".hour_slots_available").click(function () {
        $(this).toggleClass("slot_activated");
});

here is image of output

enter image description here

please guide me where i'm wrong..!

$(".hour_slots_available").click(function () { if($(this).hasClass('hour_slots_disabled')) { return; } $(this).toggleClass("slot_activated"); }); Try this! — Kalpesh Singh
– Kalpesh Singh, Commented Mar 5, 2017 at 7:19

Kalpesh Patel · Accepted Answer · 2017-03-05 07:22:59Z

1

Try this:

$(".hour_slots_available").not(".hour_slots_disabled").click(function () {
        $(this).toggleClass("slot_activated");
});

answered Mar 5, 2017 at 7:22

Kalpesh Patel

2,8202 gold badges28 silver badges54 bronze badges

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

1 Comment

user7596515 Over a year ago

That first one is working and Thanks for another solution :)

Collectives™ on Stack Overflow

how to change css class with toggleClass for specific class detected

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related