How to Uncheck All Checkboxes in jQuery

To uncheck all checkboxes in jQuery, the simplest way is to use the jQuery prop() method along with the checked property, and set it to false.

$("input[type='checkbox']").prop("checked", false);

Let’s say I have the following HTML form:

  
   I like pasta
  
   I like seafood
  
   I like hamburgers
  

To start, all of the checkboxes in the form above will be checked. We could uncheck them all individually if we wanted to, but we can also use some jQuery code to do this in one step.

To do this, we can use the prop() method as we showed above to set all checkboxes to unchecked.

$("input[type='checkbox']").prop("checked", false);

If you are using WordPress, don’t forget to change the $ to jQuery as below:

jQuery("input[type='checkbox']").prop("checked", false);

If we want to check all checkboxes using jQuery, we can use the prop() method and set it to true:

$("input[type='checkbox']").prop("checked", true);

Uncheck All Checkboxes in jQuery Using a Click

We can uncheck all checkboxes in a form using jQuery very easily by combining the prop() method with a click event.

In our HTML, we will have a simple form with 3 items, and a Select All checkbox that will allow us to set all checkboxes to checked or to uncheck them all.

  
   Select All

  
   I like pasta

  
   I like seafood

  
   I like hamburgers


  

We can utilize both the jQuery click() method and jQuery prop() method to set the checked property of the checkboxes to false.

We will also add some code to check all checkboxes as well, by just changing the checked property to true. To know whether to check or uncheck all checkboxes, we will have to see if the selectAll checkbox is checked.

$('#selectAll').click(function(){
  if( $("#selectAll").is(':checked') ){
    $("input[type='checkbox']").prop("checked", true);
  } else {
    $("input[type='checkbox']").prop("checked", false);
  }
});

The final code and output for this example of how to uncheck all checkboxes using jQuery is below:

Code Output:

Full Code:

  
   Select All

  
   I like pasta

  
   I like seafood

  
   I like hamburgers


  

Hopefully this article has been useful for you to understand how to uncheck all checkboxes in jQuery.