jQuery: check if a checkbox is checked

by firegroove

HTML

<form id="test" action="#" method="post">
  <div>
    <label>CHECKBOX 1</label>
    <input type="checkbox" name="checkbox_1" id="cb1" />
  </div>
</form>



<div id="hop">
  <label for="checkboxsolo" class="topcoat-checkbox" style="font-size:12px; position:absolute;top:3px;left:240px" title="Toggle Multiple Sections"><span style="font-size: 20px">SOLO</span>
	
    <input id="checkboxSolo" name="multiple" type="checkbox" checked="checked" aria-describedby="checkbox2-description">
		
    <div style="" class="topcoat-checkbox__checkmark"></div>
  </label>
</div>

CSS

.test {
  background-color: red;
}

JavaScript

$('#cb1').change(function() {

  var $check = $(this),
    $div = $check.parent();

  if ($check.prop('checked')) {

    $div.addClass('test');

  } else {

    $div.removeClass('test');

  }

});


$('#checkboxSolo').change(function() {

  var $check = $(this),
    $div = $check.parent();

  if ($check.prop('checked')) {

    $div.addClass('test');

  } else {

    $div.removeClass('test');

  }

});