JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.thejameskyle.com/bootstrap.css">
<link rel="stylesheet" href="http://cdn.thejameskyle.com/bootstrap-responsive.css">
<div class="btn-group">
    <label for="one" class="btn">
        <input id="one" name="num" type="radio" />
        One
    </label>
    <label for="two">
        <input id="two" name="num" type="radio" />
        Two
    </label>
    <label for="three" class="btn">
        <input id="three" name="num" type="radio" />
        Three
    </label>
    <label for="four" class="btn">
        <input id="four" name="num" type="radio" />
        Four
    </label>
</div>

CSS

body {
    padding-top: 20px;
    padding-bottom: 20px;
}

.btn-group label.btn input[type="radio"] {
    display: none;
}

JavaScript

(function($) {
    
    var radioButtons = $('label.btn input[type="radio"]');
    
    radioButtons.change(function() {
        radioButtons
            .parent('label')
            .removeClass('active')
            .end()
            .filter(':checked')
            .parent('label')
            .addClass('active');
    });
    
})(jQuery);