SO - 18537609

by John Doe

HTML

<label><input type="checkbox" id="checkAll1">Check All</label>
<label><input class='t1' type="checkbox" id="checkItem">Item 1</label>
<label><input class='t1' type="checkbox" id="checkItem">Item 2</label>
<label><input class='t1' type="checkbox" id="checkItem">Item3</label>
<br>
<label><input type="checkbox" id="checkAll2">Check All</label>
<label><input class='t2' type="checkbox" id="checkItem">Item4</label>
<label><input class='t2' type="checkbox" id="checkItem">Item5</label>

CSS

label {
 border:1px solid #ccc;
 display:block; 
 width: 80%;
}

label:hover {
 background:#eee;
 cursor:pointer;
}

JavaScript

$("#checkAll1").click(function () {
     $('input:checkbox').not(this).prop('checked', this.checked);
 });