JSFiddle - React, Tailwind, and code Playground

by Spokey

HTML

<div>
    <input type="checkbox" value="1" name="trustee" class="trustee" checked="checked" />
</div>
<div>
    <input type="checkbox" value="1" name="trustee" class="trustee" checked />
</div>
<div>
    <input type="checkbox" value="1" name="trustee" class="trustee" />
</div>
<hr />
<div>
    <input type="checkbox" value="1" name="trustee" class="wtf" checked="checked" />
</div>
<div>
    <input type="checkbox" value="1" name="trustee" class="wtf" checked />
</div>
<div>
    <input type="checkbox" value="1" name="trustee" class="wtf" />
</div>

JavaScript

$('input[type="checkbox"]').on('change', function () {
    var ch = $(this), c;
    if (ch.is(':checked')) {
        ch.prop('checked', false);
        c = confirm('Do you?');
        if (c) {
            ch.prop('checked', true);
        }
    } else {
        ch.prop('checked', true);
        c = confirm('Are you sure?');
        if (c) {
            ch.prop('checked', false);
        }
    }
});