JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
    <input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >
<input type="checkbox" class="shared" >

JavaScript

$(document).on('change', '.shared', function() {
    var countShared = $('.shared:checked').length;
    if(countShared > 3 && $(this).is(':checked')) {
        alert("You have reached the maximum number of selectable checkboxes.");
        $(this).prop('checked',false);
    }
});