JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <input type="text" id="text"></input>
</div>

<div>
    <input type="checkbox" id="checkbox">blabla</input>
</div>

<div style="width: 100px; height: 30px; background-color: #ff0000;" onclick="simulateClick('text')">
</div>

<div style="width: 100px; height: 30px; background-color: #0000ff;" onclick="simulateClick('checkbox')">
</div>

JavaScript

function simulateClick(id) {
    var evt = document.createEvent("MouseEvents");
    evt.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
    
    var cb = document.getElementById(id);
    cb.dispatchEvent(evt);
}