JSFiddle - React, Tailwind, and code Playground

by Andrey K

HTML

<link rel="stylesheet" href="http://semantic-ui.com/dist/semantic.css">
<script src="http://semantic-ui.com/dist/semantic.js"></script>
<ul class="example">
	<li>
		<div class="ui checkbox">
			<input type="checkbox" name="example" id="check-me-1">
			<label for="check-me-1">Check me 1</label>
		</div>
	</li>
	<li>
		<div class="ui checkbox">
			<input type="checkbox" name="example" id="check-me-2">
			<label for="check-me-2">Check me 2</label>
		</div>
	</li>
	<li>
		<div class="ui checkbox">
			<input type="checkbox" name="example" id="check-me-3">
			<label for="check-me-3">Check me 3</label>
		</div>
	</li>
</ul>

CSS

body {
    padding: 1em;
}

JavaScript

// Add javascript here
$(".ui.checkbox").checkbox({
	onChange: function() {
  	alert("Checked: " + $(this).is(":checked"));
  }
})