If I skip choosing the checkbox, the alert box didn’t show up and having Uncaught TypeError: Cannot read properties of null (reading ‘checked’)

If I skip choosing in the checkbox, the alert must be shown. But it didn’t work and showing Uncaught TypeError: Cannot read properties of null (reading ‘checked’) in Javascript. Error got in checked==true.

var alist = '';
      var list = document.getElementsByName('chkApprover[]');

      for (i = 0; i < list.length; i++) {
        if (document.getElementById('chkApprover' + i).checked == true) {
          alist = alist + list[i].value + '|';
        }
      }

      if (alist == "") {
        alert("Please choose at least one Approver for your request!");
        
    }

I’ve tried adding window.onload but it skipped the whole approver checkbox and I’ve no idea why it’s not working. I will provide screenshot and codes in the below. I will insert half of the names in the Approver list.

<?php  
include("_dbconn.php");

$area = isset($_GET["area"])? $_GET["area"] : "";

// $area = str_replace("1", "Production Floor Access", $area);
// $area = str_replace("2", "Office Floor Access", $area);
// $area = str_replace("3", "Specific Access Doors", $area);

if(substr($area,-1) == "|"){
    $area = substr($area,0,-1);
}
$area_list = explode("|",$area);

// print_r($area_list);
$area_clause = " area_no in ('" . implode("','", $area_list) . "')";

$ary_approver = array(
  "Albert Chin"       => "[email protected]",
  "Alberto Leotti"    => "[email protected]",
  "Alex Koh"          => "[email protected]",
  "Bala Subbu"        => "[email protected]",
  "Bertrand Seow"     => "[email protected]",
  "Calvin Goh Chin Boon"     => "[email protected]",
  "Chan Boon Hock"           => "[email protected]",
  "Cheng Kear Yong"   => "[email protected]"
);


$sql = "Select distinct(approver_name) from access_request.tbl_access_area where ".$area_clause."";
$result = mysqli_query($conn,$sql);
//echo $result;

$cnt = 0;

echo "<table align="center" border="0" width="95%" bordercolor="#DADADA" cellpadding="3" cellspacing="1">n";
echo  "<tr bgcolor="#F5F5F5"><td align="left" colspan="5">n";
    echo  "<font face="arial" size="2" color="#3C5F84">  Approver  </font>";
    echo "       ";
    echo "<tr bgcolor="#F5F5F5"><td align="left" colspan="5" style="
    display: grid;
    grid-template-columns: max-content max-content max-content max-content max-content max-content max-content max-content;
    grid-gap: 10px;
    margin-left:138px;
    margin-top:-23px;">";

    while($row = mysqli_fetch_array($result)){
        foreach($ary_approver as $k => $v){


            if($k == $row["approver_name"]){
                echo "<input type="checkbox" id="chkApprover" . $cnt . "" name="chkApprover[]" value="$v"><font face="arial" size="2" color="#3C5F84">". $k . "</font>";
                //echo "<br>           ";
            }
        }
        $cnt++;
    }

Error that’s happening.