How to check or uncheck all checkbox together

select-all-checkbox-together.html

<form action="#">
    <p><label><input type="checkbox" id="checkAll"/> Check all</label></p>
    
    <fieldset>
        <legend>Loads of checkboxes</legend>
        <p><label><input type="checkbox" /> Option 1</label></p>
        <p><label><input type="checkbox" /> Option 2</label></p>
        <p><label><input type="checkbox" /> Option 3</label></p>
        <p><label><input type="checkbox" /> Option 4</label></p>
  </fieldset>
  
  <script>
    $("#checkAll").change(function () {
      $("input:checkbox").prop('checked', $(this).prop("checked"));
    });
  </script>
    
    
    <!-- Another way -->
    <table border="1">
    <thead>
        <tr>
            <th><input type="checkbox" id="allcb" name="allcb"/></th>
            <th>values</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><input type="checkbox" id="cb1" name="cb1"/></td>
            <td>value1</td>
        </tr>
        <tr>
            <td><input type="checkbox" id="cb2" name="cb2"/></td>
            <td>value2</td>
        </tr>
        <tr>
            <td><input type="checkbox" id="cb3" name="cb3"/></td>
            <td>value3</td>
        </tr>
    </tbody>
</table>
    
    <script>
        $(function(){
            $("#allcb").click(function() {
                var chkBoxes = $("input[id^=cb]");
                chkBoxes.prop("checked", !chkBoxes.prop("checked"));
            }); 
        });
    </script>