JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr>
<td>
<ul>
<li>

<label><input type="checkbox" name="country" value="ALL"/> SELECT ALL</label>
</li>

<li>

<label><input type="checkbox" name="country" value="CD"/> CD</label>
</li>

<li>

<label><input type="checkbox" name="country" value="ED"/>ED</label>
</li>

<li>

<label><input type="checkbox" name="country" value="DD"/>DD</label>
</li>
<li>

<label><input type="checkbox" name="country" value="FD"/>FD</label>
</li>
<li>

<label><input type="checkbox" name="country" value="SD"/>SD</label>
</li>
</ul>
<td>
</tr>
</table>

JavaScript

$("input:checkbox[value=ALL]").change(function() {
    $("input:checkbox[name=" + $(this).prop("name") + "]").prop("checked", $(this).prop("checked"));
});