JSFiddle - React, Tailwind, and code Playground

by Phil Glau

HTML

<div class='overall'>
    <input type="checkbox" id="tc_all">
    <label for="tc_all">No</label>
    </input>
</div>

CSS

.overall .ui-state-active {
    border: 1px solid #333;
    background: #390 50% 50% repeat-x;
    font-weight: bold;
    color: #FFF;
}
.overall .ui-button {
    width: 100px;
    height: 35px;
}

JavaScript

$(function () {
      $("#tc_all").button().click(function () {
          var text = $(this).is(':checked') ? "Yes" : "No"
          $(this).button('option', 'label', text);
      });
  });