JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" value="" name="cb1" />
<input type="checkbox" value="" name="cb2" />
<input type="checkbox" value="" name="cb3" />
<input type="checkbox" value="" name="cb4" />
<input type="checkbox" value="" name="cb5" />
<input type="checkbox" value="" name="cb6" />
<input type="checkbox" value="" name="cb7" />
<input type="checkbox" value="" name="cb8" />
<input type="checkbox" value="" name="cb9" />
<input type="checkbox" value="" name="cb10" />

CSS

input {
  display: block;
}

JavaScript

var checkboxChecks = 1;

$('input[type=checkbox]').on('change', function() {
  var $this = $(this);
  if ($this.is(':checked')) {
    $this.val(checkboxChecks++);
  } else {
    $this.val('');
  }
});