JSFiddle - React, Tailwind, and code Playground

HTML

<p>DEMO: USING CLICK METHOD DOES NOT SET FOCUS<p>
    <ul>
      <li>Both these buttons apply the click method to the check box. </li>
      <li>An alert has been set to fire when the check box is put into focus.</li> 
    </ul>
  </p>
  <input type="checkbox" id="chk1"/>	
    <br>
    <button onclick="simclick1()">This button <strong>applies the focus method</strong> to 
      check box</button>
    <br>
    <button onclick="simclick2()">This button <strong>does not apply the focus method</strong> to check box</button>
    <br>

JavaScript

// When chk1 gets focus, pop an alert
	document.getElementById("chk1").addEventListener("focus", function(){alert("check box is in focus!");}, false);
    function simclick1() {
      chk1.focus(); //focus is explicitly set
      chk1.click(); 
    }
    function simclick2() {
      chk1.click();
    }