JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" name="foo"  value="val1" />
  <input type="checkbox" name="foo"  value="val2" />

<button id="btFoo">Foo</button>
<br />
  <input type="checkbox" name="bar"  value="val1" />
  <input type="checkbox" name="bar"  value="val2" />

<button id="btBar>Bar</button>

JavaScript

$(function(){
    $("#btFoo").click(function(){
        var checkedValuesFoo = $("input:checkbox[name='foo']:checked").map(function(){
            return this.value;
        }).get().join(',');
        alert (checkedValuesFoo);
    });
    
        $("#btBar").click(function(){
        var checkedValuesFoo = $("input:checkbox[name='bar']:checked").map(function(){
            return this.value;
        }).get().join(',');
        alert (checkedValuesFoo);
    });
});