SO - 18537609
by John Doe
HTML
<label><input type="checkbox" id="t1" class='check'>Check All</label>
<label><input class='t1' type="checkbox">Item 1</label>
<label><input class='t1' type="checkbox">Item 2</label>
<label><input class='t1' type="checkbox">Item3</label>
<br>
<label><input type="checkbox" id="t2" class='check'>Check All</label>
<label><input class='t2' type="checkbox">Item4</label>
<label><input class='t2' type="checkbox">Item5</label>
CSS
label {
border:1px solid #ccc;
display:block;
width: 80%;
}
label:hover {
background:#eee;
cursor:pointer;
}
JavaScript
$(".check").click(function () {
$('.'+this.id).not(this).prop('checked', this.checked);
});