JSFiddle - React, Tailwind, and code Playground

HTML

<p>Group 1</p>
<input type='checkbox' value='1' class='unique' data-group='group1'>
<input type='checkbox' value='2' class='unique' data-group='group1'>
<br/>
<p>Group 2</p>
<input type='checkbox' value='1' class='unique' data-group='group2'>
<input type='checkbox' value='2' class='unique' data-group='group2'>

JavaScript

$(document).ready(function()
                  {
$('input.unique').click(function() {
  if (!$(this).prop('checked'))
  {
    return;
  }
  var group = $(this).data('group');
  if (group)
  {
    $('input[data-group="' + group + '"]:checked').prop('checked', false);
    $(this).prop('checked', true);
  }
});
                  });