JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<form>
    <input class="form-control" name="example">
    <br />
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary">
            <input type="radio" name="options" id="option1" autocomplete="off">Radio 1 (preselected)</label>
        <label class="btn btn-primary">
            <input type="radio" name="options" id="option2" autocomplete="off">Radio 2</label>
        <label class="btn btn-primary">
            <input type="radio" name="options" id="option3" autocomplete="off">Radio 3</label>
    </div>
</form>

JavaScript

$('body').on('keyup mouseup ', 'li, label, input, textarea, select', function (e) {
    var inputs = $('form :input');
    var errors = {};
    inputs.each(function (i, element) {
        if ($(element).attr('name') !== undefined) {
            if ($(element).attr('type') !== 'radio') {
                if ($.trim($(element).val()) === '') {
                    errors[i] = $(element).attr('name');
                }
            } else {
                if ($('.active', $("input[name='" + $(element).attr('name') + "']").closest('.btn-group')).length <= 0) {
                    errors[i] = $(element).attr('name');
                }
            }
        }
    });
    console.log(errors);
    if (!$.isEmptyObject(errors)) {
        alert('The form has some errors!');
    } else {
        alert('The form is valid.');
    }
});