jquery: checking if any checkbox is checked only works on the first checkbox checked

confusing!

I have a grid with (hidden) checkboxes like this:

U see, some are selected, but not all.

I want my greyed out button at the bottom to become enabled (opacity = 1) when any of the checkboxes is eneblaed, and disabled when all are unchecked.
My code works but only with the first checkbox i pick when I start this process.
All checkboxes are from the class .checkbox.

Here is what I tried:

<script>
    $(".checkbox").change(function () {
        $('.checkbox').each(function (i, obj) {
            if (obj.checked) {
                $('.baseButton').prop("disabled", false);
                jQuery('.baseButton').css('opacity', '1');
            }
            else {
                // disable
                $('.baseButton').prop("disabled", true);
                jQuery('.baseButton').css('opacity', '0.2');
            }
        });       
    });
</script>

What am I trying?
I added a change handler to each checkbox, and when its fired, it is supposed to cycle through all checkboxes and check their state. If any is checked, enable the button, if non disable. but somehow it doesnt work.

>Solution :

Almost. You’re looping through the checkboxes, but for each one you’re deciding whether to enable or disable the button. So the only one which actually results in enabling or disabling the button is the last checkbox, over-writing any changes made by previous iterations of the loop.

You can track in a separate variable outside of the loop whether any of the checkboxes are checked, and then enable or disable after the loop based on that. For example:

$(".checkbox").change(function () {
    let isChecked = false;

    $('.checkbox').each(function (i, obj) {
        if (obj.checked) {
            isChecked = true;
        }
    });

    if (isChecked) {
        $('.baseButton').prop("disabled", false);
        jQuery('.baseButton').css('opacity', '1');
    }
    else {
        // disable
        $('.baseButton').prop("disabled", true);
        jQuery('.baseButton').css('opacity', '0.2');
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox">
<button class="baseButton" style="opacity:0.2;" disabled="true">button</button>