JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.js"></script>
<form role="form" action="#" method="post" id="durationForm">

<tr>
<td colspan = "3">Please enter the duration?</td>
</tr>
<tr>
    <td width="10%"><input type="number" class="form-control" id="duration"  name="duration"/></td>
<label for="duration" class="validateError"></label>
<td width="50%">
<div class="controls">
<label class="radio">
    <input type="radio" name="radioduration" value="Hours" required="true" /> Hours</label>
<label class="radio">
    <input type="radio" name="radioduration" value="Days" required="true" /> Days</label>
<label class="radio">
    <input type="radio" name="radioduration" class="jradiodurationUnsure" value="Unsure" required="true" /> Unsure</label>
<label for="duration" class="validateError"></label>
</div>
</td>
</tr>

<button type="submit" class="btn btn-primary">Next</button>

</form>

CSS

.validateError {
color: red;
}

JavaScript

$(document).ready(function () {
     // initialize the plugin
     $("#durationForm").validate({ 
         errorClass: "validateError",
         rules: {
             duration: {
                 required: '.jradiodurationUnsure:unchecked'
             }
         }
		 });
	 });