JSFiddle - React, Tailwind, and code Playground
HTML
<label for="check-1">
<input id="check-1" type="checkbox" class="check-group" checked="checked" />check-1</label>
<label for="check-2">
<input id="check-2" type="checkbox" class="check-group" />check-2</label>
<label for="check-3">
<input id="check-3" type="checkbox" class="check-group" />check-3</label>
CSS
.alertar {
background-color: #fbb;
}
JavaScript
$(function () {
var checkGroup = $(".check-group");
checkGroup.on("click", function (e) {
var marcadas = checkGroup.filter(function () {
return this.checked;
});
if (marcadas.length < 1) {
e.preventDefault();
$(this).closest('label').addClass('alertar');
return;
}
checkGroup.closest('label').removeClass('alertar');
});
})