JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/additional-methods.js"></script>
<span id="error_message" class="error_msge">
                        
                    </span>

<form autocomplete="off" class="educationForm" name="educationForm" id="educationForm" method="POST" action="#">
    
    <div class="row">
        <div class="col-xs-6 col-sm-3 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required" id="chk_Vis" name="chk_1" />
            <label>Vision</label>
        </div>
        <div class="col-xs-6 col-sm-3 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required" id="chk_Hear" name="chk_1" />
            <label>Hearing</label>
        </div>
        <div class="col-xs-6 col-sm-3 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required" id="chk_Mob" name="chk_1" />
            <label>Mobility</label>
        </div>
        <div class="col-xs-6 col-sm-3 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required" id="chk_Ler" name="chk_1" />
            <label>Learning</label>
        </div>
        <div class="col-xs-6 col-sm-3 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required" id="chk_Med" name="chk_1" />
            <label>Medical</label>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-6 col-sm-2 col-md-2">
            <input type="checkbox" class="chk_Field_hlt required chk_field_hlt chk_clk" id="chk" name="chk_1" />
            <label>Other</label>
        </div>
        <div class="col-xs-6 col-sm-10 col-md-10">
            <div class="oth_txt"><b>Explain:</b>

                <input class="exp_txt chk_field_hlt ipt_Field required" name="exp_txt" maxlength="100"...

CSS

.error_message {
    background-color:#f08080;
    color:#fff;
    border:1px solid red;
    text-align:center
}
.errRed {
    color:#000!important;
    border:0!important;
    padding:6px!important;
    outline:1px solid #EA373D!important
}
.errRed_chkb {
    color:#000!important;
    outline-color:#EA373D;
    outline-style:solid;
    outline-width:1px
}
.error_msge {

}

JavaScript

$(document).ready(function () {    
    $('.error_msge').hide();
    $(".oth_txt").hide();
    $(document).on('click', ".chk_field_hlt", function () {
        if ($('.chk_clk').prop('checked')) {
            $(".oth_txt").show();
        } else {
            $(".oth_txt").hide();
        }
    });
    apply_validation();

    function apply_validation() {
        $(".educationForm").validate({
            ignore: "input[type='text']:hidden",
            onkeyup: false,
            showErrors: function (errorMap, errorList) {
                var errors = this.numberOfInvalids();

                if (errors) {
                    var message = errors === 1 ? 'You missed 1 field. It has been highlighted' : 'You have missed ' + errors + ' fields. Please fill the highlighted field before submit.';
                    $("#error_message").html(message);
                    $(".error_msge").show();
                } else {
                    $(".error_msge").hide();
                }
                this.defaultShowErrors();
            },
            errorPlacement: function () {
                return false;
            },
            highlight: function (element) {
                if ($(element).is(':radio')) {
                    return false;
                } else {
                    $(".educationForm").find('[name="' + $(element).attr('name') + '"]').addClass('errRed');
                }
                $(element).prevAll('label').find('span.required-star').addClass('text-error-red').removeClass('text-error-black');
            },
            unhighlight: function (element) {

                if ($(element).is(':radio')) {
                    return false;
                } else {
                    $(".educationForm").find('[name="' + $(element).attr('name') + '"]').removeClass('errRed');
                }
                $(element).prevAll('label').find('span.required-star').addClass('text-error-black').removeClass('text-error-red');

            }
       ...