JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="cb1">Checkbox #1
<input type="checkbox" id="cb2">Checkbox #2
<input type="checkbox" id="cb3">Checkbox #3
<hr />
Checked ids: <div id="results">
</div>
JavaScript
$(document).ready(displayCheckbox);
function displayCheckbox() {
var checkboxes = $("input[type=checkbox]");
var results = $("#results");
$.each(checkboxes, function() {
$(this).change(printChecked);
})
function printChecked() {
var checkedIds = [];
checkboxes.each(function() {
if($(this).is(':checked')) {
checkedIds.push($(this).attr('id'));
}
});
console.log(results);
results.text(checkedIds);
}
}