JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<input type="checkbox" name="regions[]" value="120" id="selectall">
<label>
  &nbsp;Lanckorona</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="28" class="idRow">
<label>
  &nbsp;Izdebnik</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="30" class="idRow">
<label>
  &nbsp;Jastrzębia</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="27" class="idRow">
<label>
  &nbsp;Lanckorona</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="31" class="idRow">
<label>
  &nbsp;Podchybie</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="29" class="idRow">
<label>
  &nbsp;Skawinki</label>
<br>



<input type="checkbox" name="regions[]" value="125" id="selectall">
<label>
  &nbsp;Liszki</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="60" class="idRow">
<label>
  &nbsp;Liszki</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="61" class="idRow">
<label>
  &nbsp;Morawica</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="62" class="idRow">
<label>
  &nbsp;Piekary</label>
<br>



<input type="checkbox" name="regions[]" style="margin-left:15px;" value="63" class="idRow">
<label>
  &nbsp;Rączna</label>
<br>

JavaScript

$(document).on('change', '#selectall', function() {
  $(".idRow").prop("checked", $(this).prop("checked"))
});
$(".idRow").click(function() {
  if ($(".idRow").length == $(".idRow:checked").length) {
    $("#selectall").prop("checked", "checked");
  } else {
    $("#selectall").removeAttr("checked");
  }
});