JSFiddle - React, Tailwind, and code Playground

HTML

<input id='x_main' type='checkbox'/>Main<br>
<p>--------------------------------</p>
<div id='checks'>
    <input type='checkbox'/>1<br>
    <input type='checkbox'/>2<br>
</div>
<p>--------------------------------</p>
<i>1 - Click on 1 or 2 <br>2 - Try <b>Main</b> checkbox. <br>
3 - Main checkbox isn't working</i>

JavaScript

checks_bind();
function checks_bind(){
	$("#x_main").off('click');
  $("#x_main").on('click',function(){
  	var obj	= $(this);
		var val	= obj.is(':checked');
		$("#checks").find("input[type='checkbox']").attr('checked',val);
  })
}