Online Snippets Library

Select and Deselect All Checkboxes in jQuery

To Select and Deselect all Checkboxes, we will use prop() function of jQuery.

Example

HTML
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"> </script>
<title>Select and Deselect All Checkboxes in jQuery</title>
</head>
<body>
<input type="checkbox" id="checkAll" /> Select / Deselect CheckBox
<br>
<input type="checkbox" class="checkBox" name="checkbox[]" id="Checkbox1" /> CheckBox1
<br/>
<input type="checkbox" class="checkBox" name="checkbox[]" id="Checkbox2" /> CheckBox2
<br/>
<input type="checkbox" class="checkBox" name="checkbox[]" id="Checkbox3" /> CheckBox3
<br/>
<input type="checkbox" class="checkBox"  name="checkbox[]" id="Checkbox4" /> CheckBox4
</body>
</html>
Javascript
$(document).ready(function(){
$("#checkAll").click(function () {
$(".checkBox").prop('checked', $(this).prop('checked'));
});
});