JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <input type="checkbox"/>
    <input type="button" value="button" />
    <span>span</span>
</div>

JavaScript

/* Wrapper could be any element, methinks */
$('div').on('click', 'input:checkbox', function(e){
    e.preventDefault();
});


/* Uncomment to make the checkbox work again 
$('input').on('click', function(e){
    e.stopPropagation();
});
*/

/* Other element's click's execute - the checkbox is a special case */
$('div').on('click', 'span', function(){
    $(this).text($(this).text() + ' clicked');
});
$('div').on('click', 'input:button', function(){
    $(this).val($(this).val() + ' clicked');
});