JSFiddle - React, Tailwind, and code Playground

by Hans PUFAL

HTML

<label>A : <input  class="test"type="checkbox" value="A" /></label>
<label>B : <input  class="test"type="checkbox" value="B" /></label>    
<label>C : <input  class="test"type="checkbox" value="C" /></label>
<label>D : <input  class="test"type="checkbox" value="D" /></label>
<br />
<button id="doit">Show checked</button><pre id="result"></pre>

JavaScript

document.getElementById ('doit').addEventListener ('click', function (ev) {
  document.getElementById ('result').innerHTML = 
      [].slice.call (document.querySelectorAll ('.test:checked'))
                .map (function (el) {
                        return el.value;
                     })
                .join (';');
}, false);