How to count the number of checked checkboxes on blur event

Question

I am trying to count the number of checked checkboxes on blur event. But it looks like the number of blur events is being counted. How to count the number of checked checkboxes in array?

 const requiredBoxes = [...document.querySelectorAll('.js-form-checkbox')]; requiredBoxes.forEach(function (input) { input.addEventListener('blur', () => { console.log(requiredBoxes.filter(item => item.checked).length); }); });

 <input type="checkbox" class="js-form-checkbox" /> <input type="checkbox" class="js-form-checkbox" /> <input type="checkbox" class="js-form-checkbox" /> <input type="checkbox" class="js-form-checkbox" />

Answer 1

The clicks are not being counted, when you press the checkbox, you don't see the blur event immediately. You can check by checking the checkbox and clicking elsewhere but checkboxes.