Select only one checkbox in a group

I have a lot of the same <div class="checkbox product-option">, where each four div's do belong to each other.

So 1-4 is a group, 5-8 is a group etc.

Is there a way to allow only 1 checkbox in a group to be selected?

I currently have this code, but that works for all checkbox and not for a group of four.

jQuery:

$('input[type="checkbox"]').on('change', function() {
   $('input[type="checkbox"]').not(this).prop('checked', false);
});

HTML:

<div class="checkbox product-option">
    <label for="addon1">
        <span class="product-option-text">
            <input class="checkbox-row" type="checkbox" name="addons[1]" id="addon1" onclick="prodconfrecalcsummary()">
            <span class="text">Text</span>
        </span>
    </label>
</div>

<div class="checkbox product-option">
    <label for="addon11">
        <span class="product-option-text">
            <input class="checkbox-row" type="checkbox" name="addons[11]" id="addon1" onclick="prodconfrecalcsummary()">
            <span class="text">Text</span>
        </span>
    </label>
</div>

<div class="checkbox product-option">
    <label for="addon12">
        <span class="product-option-text">
            <input class="checkbox-row" type="checkbox" name="addons[21]" id="addon1" onclick="prodconfrecalcsummary()">
            <span class="text">Text</span>
        </span>
    </label>
</div>

<div class="checkbox product-option">
    <label for="addon54">
        <span class="product-option-text">
            <input class="checkbox-row" type="checkbox" name="addons[54]" id="addon1" onclick="prodconfrecalcsummary()">
            <span class="text">Text</span>
        </span>
    </label>
</div>