JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr id="childr1">
        <td>
            <input type="checkbox" id="childinput1" />
        </td>
    </tr>
    <tr id="childr2">
        <td>
            <input type="checkbox" id="childinput2" />
        </td>
    </tr>
</table>

JavaScript

//attach an event "click" by delegation
$(document).on("customevent", "#childinput1", function (e) {
    e.preventDefault();
    alert('in delegated  "custom" event handler');
});
$(document).on("click", "#childinput1", function (e) {
    alert('in delegated  "click" event handler');
});
testTrigger();

function testTrigger() {
    $("#childinput1").trigger("customevent");
}