JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li><input type="checkbox" level="child" name="somename3" value="1" /> Child 1</li>
<li><input type="checkbox" level="child" name="somename4" value="2" /> Child 2 <br />
<ul>
<li><input type="checkbox" level="subchild" name="somename1" value="3" />Sub Child 1</li>
<li><input type="checkbox" level="subchild" name="somename2" value="3" />Sub Child 2</li>
</ul>
</li>
<li ><input type="checkbox" level="child" name="somename3" value="3" /> Child 3</li>
</ul>
JavaScript
$('input[type=checkbox][level="child"]').on('click', function () {
var checked = $(this).is(':checked');
// go up the dom to the parent of checkbox (li)
$(this).closest('li')
// find all subchild checkboxes
.find('input[type=checkbox][level="subchild"]')
// make them as the parent checkbox (checked or not)
.prop('checked', checked);
});