JSFiddle - React, Tailwind, and code Playground
HTML
<div id="checkboxlist" >
<ul class="checkboxlist_list">
<li>
<input type="checkbox" class="checkbox keys" name="keys" value="150" />Keys<br>
</li>
<li>
<input type="checkbox" class="checkbox elec_guit" name="elec_guit" value="150" />Electric Guitar<br>
</li>
<li>
<input type="checkbox" class="checkbox acou_guit" name="acou_guit" value="150" />Acoustic Guitar<br>
</li>
<li>
<input type="checkbox" class="checkbox bass" name="bass" value="150" />Bass<br>
</li>
<li>
<input type="checkbox" class="checkbox drums" name="drums" value="150" />Drums<br>
</li>
</ul>
</div>
Summary:<br>
<div class="summary_musicians"></div>
JavaScript
$('.checkbox').change(function() {
$(".summary_musicians").html(function() {
return $('.checkbox:checked').map(function() {
return this.nextSibling.nodeValue;
}).get().join(', ');
});
});