javascript - add class if check box is checked and assign a class to it's parent div using jquery -
i need add class parent div of checked checkboxes, example on click of button want check checked check boxes inside corresponding parent div, when there checked value, new class should added parent div. e.g html code is
<div class="parent"> <input type="checkbox" name="a" /> <input type="checkbox" name="b" /> </div> <div class="parent"> <input type="checkbox" name="c" /> <input type="checkbox" name="d" /> </div> <button>add class parent div</button>
by using :has(), parents point of view, can do
$('button').click(function(){ $('.parent:has(:checked)').addclass('my-class'); $('.parent:not(:has(:checked))').removeclass('my-class'); });
$('button').click(function(){ $('.parent:has(:checked)').addclass('my-class'); $('.parent:not(:has(:checked))').removeclass('my-class'); });
.my-class{ background:green; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div class="parent"> <input type="checkbox" name="a" /> <input type="checkbox" name="b" /> </div> <div class="parent"> <input type="checkbox" name="c" /> <input type="checkbox" name="d" /> </div> <button>toggle class parent div</button>
Comments
Post a Comment