JSFiddle - React, Tailwind, and code Playground

HTML

<div class="demo">
 
<form>
    <div id="radio">
        <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
        <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
        <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
    </div>
    
     <div id="marco">
        <input type="radio" id="444" name="radio" /><label for="444">Choice 1</label>
        <input type="radio" id="888" name="radio" checked="checked" /><label for="888">Choice 2</label>
        <input type="radio" id="555" name="radio" /><label for="555">Choice 3</label>
    </div>

</form>

CSS

.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }


/*!
 * jQuery UI Button 1.8.20
 *
 * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Button#theming
 */
.ui-button
{
    display: inline-block;
    position: relative;
    padding: 0;
    margin-right: .1em;
    text-decoration: none !important;
    cursor: pointer;
    text-align: center;
    zoom: 1;
    overflow: visible;
}
/* the overflow property removes extra width in IE */
.ui-button-icon-only
{
    width: 2.2em;
}
/* to make room for the icon, a width needs to be set here */
button.ui-button-icon-only
{
    width: 2.4em;
}
/* button elements seem to need a little more width */
.ui-button-icons-only
{
    width: 3.4em;
}
button.ui-button-icons-only
{
    width: 3.7em;
}

/*button text element */
.ui-button .ui-button-text
{
    display: block;
    line-height: 1.4;
}
.ui-button-text-only .ui-button-text
{
    padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text
{
    padding: .4em;
    text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text
{
    padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text
{
    padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text
{
    padding-left: 2.1em;
    padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button
{
    padding: .4em 1em;
}

/*button icon element(s) */
.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon
{
    position: absolute;
    top: 50%;
    margin-top: -8px;
}
.ui-button-icon-only .ui-icon
{
    left: 50%;
   ...

JavaScript

$(function() {
        $( "#radio" ).buttonset( );
    $( "#marco" ).buttonset();

    });