JSFiddle - React, Tailwind, and code Playground
HTML
<form id="myform">
<input type="checkbox" name="flag1" checked> Flag 1
<input type="checkbox" name="flag2" checked> Flag 2
</form>
<button id="update">Update</button>
<div id="output"></div>
JavaScript
var form = document.getElementById('myform');
var inputs = form.getElementsByTagName('input');
var output = document.getElementById('output');
document.getElementById('update').onclick = function() {
var flags = [];
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type === 'checkbox') {
flags.push(inputs[i].name + ': ' + (inputs[i].checked ? 'checked' : 'unchecked'));
}
}
output.innerHTML = flags.join('<br>');
};