JSFiddle - React, Tailwind, and code Playground

HTML

<label><input type="checkbox" id="all" onclick="selectAll()"> Select all</label><br>
<br>
<label><input type="checkbox" name="ref"> Checkbox 1</label><br>
<label><input type="checkbox" name="ref"> Checkbox 2</label><br>
<label><input type="checkbox" name="ref"> Checkbox 3</label><br>
<label><input type="checkbox" name="ref"> Checkbox 4</label><br>
<label><input type="checkbox" name="ref"> Checkbox 5</label><br>

JavaScript

function selectAll() {
  var all = document.getElementById("all");
  var boxes = document.getElementsByName("ref");

  for (var i = 0; i < boxes.length; i++) {
    boxes[i].checked = all.checked;
  }
}