JSFiddle - React, Tailwind, and code Playground

HTML

<p><b>Results:</b> <span id="results"></span></p>
  <form>
    <input type="checkbox" name="Check01" value="true" />
    <label for="ch1">check1</label>
      
    <input type="checkbox" name="Check02" value="true" checked="checked" />
    <label for="ch2">check2</label>]
  </form>

CSS

body, select { font-size:14px; }
  form { margin:5px; }
  p { color:red; margin:5px; }
  b { color:blue; }

JavaScript

function showValues() {
      var fields = $("form").serializeArray();
      $("#results").empty();
      jQuery.each(fields, function(i, field){
        $("#results").append("["+field.name+" = " + field.value + "] ");
      });
    }

    $(":checkbox, :radio").click(showValues);
    $("select").change(showValues);
    showValues();