JSFiddle - React, Tailwind, and code Playground

HTML

<div><label><input id="ChkAll" type="checkbox" onchange="javascript:CheckedAll();" /><span>SelectAll</span></label></div> 
 <div id="DivChk">
    <label><input type="checkbox" /><span>First</span></label>
    <label><input type="checkbox" /><span>2nd</span></label>
    <label><input type="checkbox" /><span>3rd</span></label>
    <label><input type="checkbox" /><span>4th</span></label>
</div>

JavaScript

function CheckedAll(){
    debugger
     if ($('#ChkAll').is(':checked')) {
         
          $('#DivChk input[type=checkbox]').attr('checked', 'checked');           
     }
     else {
          $('#DivChk input[type=checkbox]:checked').removeAttr('checked');
     }
   }