BeDesinged
BeDesinged

Reputation: 55

How do I add a class to the container div of a checkbox when the checkbox is checked on and off?

I want to add a background color to the container(div.checkbox_db), when the checkbox(input.check-group) is activated using jquery. Can I do this..? Here is my html code I am working with:

<div class="grid_3 checkbox_db off-check">

    <input type="checkbox" class="check-group" id="check-1" name="check-1">

    <label for="check-1" class="group">Checkbox</label>

</div>

Upvotes: 0

Views: 129

Answers (2)

Bunlong
Bunlong

Reputation: 662

I think it is what you want:

javascript

$(".grid_3").removeClass('off-check');
    $('.check-group').click(function(){
    if($(this).is(':checked')){
        $(this).parent().addClass('off-check');
    }
    else {
        $(this).parent().removeClass('off-check');
    }
});

stylesheet

.off-check{
 background-color:yellow;  
}

Demo here: http://jsfiddle.net/kxFCd/

Upvotes: 0

Ohgodwhy
Ohgodwhy

Reputation: 50798

$('.check-group').click(function(){
  if($(this).is(':checked')){
    $(this).parent().addClass('some_class');
  }else{
    $(this).parent().removeClass('some_class');
  }
});

Upvotes: 1

Related Questions