JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div class="nonwidget">
<label for="cb1">Test 1</label>
<input type="checkbox" id="cb1" class="toggle"/>
<label for="cb2">Test 2</label>
<input type="checkbox" id="cb2" class="toggle" checked="checked"/>
</div>
  
<div class="dlg">
<label for="cb3">Test 1</label>
<input type="checkbox" id="cb3" class="toggle"/>
<label for="cb4">Test 2</label>
<input type="checkbox" id="cb4" class="toggle" checked="checked"/>
</div>

JavaScript

$('.dlg').dialog();
$('.toggle').checkboxradio();
$('.nonwidget,.ui-widget-content').controlgroup({"direction": "vertical"});