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(){    
     if (document.getElementById('ChkAll').checked) {
         for(i=0; i<document.getElementsByTagName('input').length;i++){
         document.getElementsByTagName('input')[i].checked = true;
         }
     }
     else {
         for(i=0; i<document.getElementsByTagName('input').length;i++){
          document.getElementsByTagName('input')[i].checked = false;
         }
     }
   }