How to check and uncheck all checkboxes in WebGrid column?

Is there any reason why this is not working to check and uncheck the checkboxes? If I don't touch any of the checkboxes, it checks and unchecks them all on the button click event. If I manually check a box, that box will not be modified from then on, however the rest of them will continue to be modified.

How do I solve the problem?

function checkAll() {
  $('#grid tbody tr').each(function () {
    if ($(this).find("td input[type=checkBox]").is(":checked")) {
      $(this).find("td input[type=checkBox]").removeAttr("checked");
      //$(this).find("td input[type=checkBox]").attr("checked", false); //also tried this
    }
    else {
      $(this).find("td input[type=checkBox]").attr("checked", true);
    }
  });
}