JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" class="checkboxes" id="a" value=false />
<input type="checkbox" class="checkboxes" id="b" value=false/>
<input type="checkbox" class="checkboxes" id="c" value=false/>
<input type="checkbox" class="checkboxes" id="d" value=false/>

JavaScript

$(document).ready(function () {
    
    $('.checkboxes').change(function (event) {
        if ($(this).is(':checked')) {
            var captureId = $(this).attr('id');
            $(this).val(true);
            alert($(this).val());
        }
        else {$(this).val(false);
              alert($(this).val());}
    });
});