JSFiddle - React, Tailwind, and code Playground

HTML

<div id="checkboxlist" >
    <ul class="checkboxlist_list">
        <li>
            <input type="checkbox" name="instrument" id="Keys" value="150" />
        </li>
        <li>
            <input type="checkbox" name="instrument" id="Electric Guitar" value="150" />
        </li>
        <li>
            <input type="checkbox" name="instrument" id="Acoustic Guitar" value="150" />
        </li>
        <li>
            <input type="checkbox" name="instrument" id="Bass" value="150" />
        </li>
        <li>
            <input type="checkbox" name="instrument" id="Drums" value="150" />
        </li>
    </ul>
</div>
Summary:<br>
<div id="summary_musicians"></div>

JavaScript

$('input:checkbox[name=instrument]').change(function() {
    $("#summary_musicians").html(function() {
        return $("input[name='instrument']:checked").attr('id').map(function() {
               return this.nextSibling.nodeValue;
        }).get().join(', ');
    });
});