Solved: Change static entered data to dynamic with counter

I have this code:

<?php if($dayt == '1'){  }?>
      </td>
      <td>
      <center>
      <input type="checkbox" class="colour-button cbb" name="v1" value="10 - 12" id="btn1012" /><label for="btn1012"> <i class="fa fa-check-circle hide12" id="chk-btn1012"></i>  <?php echo $dayt?></label>
      <input type="checkbox" class="colour-button cbb" name="v1" value="10 - 12" id="btn1214" /><label for="btn1214" class="labe"><i class="fa fa-check-circle hide12" id="chk-btn1214"></i> <?php echo $row3[10]?></label>
      </center>
      </td>
      <td>
              <?php }?>
      
      </td>
            <td>
            <center>
      <input type="checkbox" class="colour-button cbb22" name="v2" value="10 - 12" id="btn10" /><label for="btn10"><i class="fa fa-check-circle hide13" id="chk-btn10"></i>  10am - 12pm</label>
        <input type="checkbox" class="colour-button cbb22" name="v2" value="10 - 12" id="btn12" /><label for="btn12" class="labe"><i class="fa fa-check-circle hide13"  id="chk-btn12"></i>  5pm - 7pm</label>
      </center>

Open in new window

And this is the Javascript I have:

<script>
$(function() {
	  $(".colour-button").click(enable_cb);
	});
	function enable_cb() {
		   if (this.checked) {
		        //this will mean at least one is always checked
		        $("input.colour-button1").prop("disabled", false);
		        $("#chk-" + this.id).show();
		    }
		    else {
		        //in this case, hide the element if you need to, but check for ANY items
		        //$("input.colour-button1").attr("disabled", true);
		        $("#chk-" + this.id).hide();

		        if ($(".colour-button:checked").length == 0) {
		            $("input.colour-button1").attr("disabled", true).prop("checked", false);
		            $('.hide11').hide(); 
		        	 $('#submit').attr('disabled', true).removeClass('orangeBtn23').addClass('disabled'); //disable input
			            
		        }
		    }
		}
</script>

Open in new window

Now the first part of my code I want to change it from static to dynamic, meaning I have a query and I want my input box to be inside my while loop for it to execute a variable in each loop. My only issue here is the id "chk-btn10..." Because I have them statically now to use in my javascript, is there a way I can make my id = "chk-btn ++" that it increments everytime so I can add it statically and not ruin my javascript?

My query while loop is before the code like this:

While($row= mysqli_query_rows($result)){

//MY CODE SHOWN ABOVE


}

Open in new window

<?php // demo/temp_jasmine.php /** * https://www.experts-exchange.com/questions/29011721/Change-static-entered-data-to-dynamic-with-counter.html */ error_reporting(E_ALL); echo '<pre>'; // SIMULATED RESULTS SET $rows = [ 'a', 'b', 'c' ]; // SET A COUNTER $num = 0; // ARRAY SHIFT WOULD BE REPLACED WITH THE APPROPRIATE "_FETCH" METHOD while ($row = array_shift($rows)) { // INCREMENT THE COUNTER $num++; $new = $row[0] . $num; echo PHP_EOL . $new; }