JSFiddle - React, Tailwind, and code Playground
HTML
<div class="form-group">
1 <input type="checkbox" name="checkers" /> <br />
2 <input type="checkbox" name="checkers" /> <br />
3 <input type="checkbox" name="checkers" /> <br />
4 <input type="checkbox" name="checkers" />
</div>
<div class="form-group">
Remove User? <input type="checkbox" id="remove-user" />
</div>
<div class="form-group">
Selected Count: <span class="amount"></span>
</div>
JavaScript
/*
Lines 5-10 will probably only work properly if this is written at the BOTTOM of the page. Unless you put it on a $(document).ready(function() { .. } );
*/
var length;
length = $('input[type="checkbox"]:checked').length;
if ( length === 0 ) {
$('#remove-user').addClass('disabled');
} else {
$('#remove-user').removeClass('disabled');
}
// Each time a checkbox is clicked it'll run this check
$('input[type="checkbox"]').click(function() {
var length;
length = $('input[type="checkbox"]:checked').length;
$('.amount').text(length);
if ( length === 0 ) {
$('#remove-user').addClass('disabled');
} else {
$('#remove-user').removeClass('disabled');
}
});