I have 3 check box and one button so when I click in this button all must checked and if i click again all must uncheck but it does not working I want all function inside my object like this
btn: null,
check: function(checked = true) {
const checkboxes = document.querySelectorAll('input[name="cb"]');
checkboxes.forEach((checkbox) => {
checkbox.checked = checked;
});
},
checkAll: function() {
this.check();
this.onclick = uncheckAll;
},
uncheckAll: function() {
this.check(false);
this.onclick = checkAll;
},
}
btn.check();<body style="background-color: #0d1117; color: #6D859E">
<div style="margin: 60px;">
<button id="btn">Check / Uncheck All</button>
<ul style="list-style-type: none; padding: 0">
<li>
<label for="c1"><input type="checkbox" name="cb" value="1" id="c1">1</label>
</li>
<li>
<label for="c2"><input type="checkbox" name="cb" value="2" id="c2">2</label>
</li>
<li>
<label for="c3"> <input type="checkbox" name="cb" value="3" id="c3">3</label>
</li>
</ul>
</div>
</body>