Add Class to parent div where contain input checkbox with value [duplicate]

Question

I have following code

<div class="subjects-list">
  <input type="checkbox" class="subject" value="Math">
</div>

<div class="subject-list">
  <input type="checkbox" class="subject" value="Sports">
</div>

I have checkbox value. I want to add class"taken" to div with "subjects-list" class and input with the specified value. What if the perfect way to do this?

for example if value "Sports"

<div class="subjects-list">
  <input type="checkbox" class="subject" value="Math">
</div>

<div class="subject-list taken">
  <input type="checkbox" class="subject" value="Sports">
</div>

Solution

I run in on ready document:

  $('input[type=checkbox]').each(function(index,item){
       var subject = $(item).val();
       if(subject == 'Sports'){
            $(item).parent().addClass('taken');
        }
    });

$(".subject-list").addClass("taken")???

Tân
– Tân

2020-01-09 08:44:56 +00:00
Commented Jan 9, 2020 at 8:44 — Tân
– Tân, Commented Jan 9, 2020 at 8:44
Note in the duplicate that this is the best answer

Rory McCrossan
– Rory McCrossan

2020-01-09 08:48:41 +00:00
Commented Jan 9, 2020 at 8:48 — Rory McCrossan
– Rory McCrossan, Commented Jan 9, 2020 at 8:48

Rory McCrossan · Accepted Answer · 2020-01-16 10:08:34Z

0

If you want to add class to parent to div when checked then do this.

$('input[type=checkbox']).on('change', function() {
  if ($(this).prop('checked') {
    $(this).parent().addClass('taken');
  } else {
    $(this).parent().removeClass('taken');
  }
});

Or If you want to just add class by value

$('input[type=checkbox']).each(function(index, item) {
  var subject = $(item).val();
  if (subject == 'Sprots') {
    $(item).parent().addClass('taken');
  }
});

edited Jan 16, 2020 at 10:08

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

answered Jan 9, 2020 at 8:48

chuu

1286 bronze badges

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

Collectives™ on Stack Overflow

Add Class to parent div where contain input checkbox with value [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related