JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<form id="my_form">
<dd>
<label for="Record_Start_Time">Start Time:</label>
<select name="Record_Start_Time" id="Record_Start_Time" onchange="checktime()">
<option selected value="0800">0800 - 8:00 am</option>
<option value="0830">0830 - 8:30 am</option>
<option value="0900">0900 - 9:00 am</option>
<option value="0930">0930 - 9:30 am</option>
<option value="1000">1000 - 10:00 am</option>
<option value="1030">1030 - 10:30 am</option>
<option value="1100">1100 - 11:00 am</option>
<option value="1130">1130 - 11:30 am</option>
<option value="1200">1200 - 12:00 pm</option>
<option value="1230">1230 - 12:30 pm</option>
<option value="1300">1300 - 1:00 pm</option>
<option value="1330">1330 - 1:30 pm</option>
<option value="1400">1400 - 2:00 pm</option>
<option value="1430">1430 - 2:30 pm</option>
<option value="1500">1500 - 3:00 pm</option>
<option value="1530">1530 - 3:30 pm</option>
<option value="1600">1600 - 4:00 pm</option>
<option value="1630">1630 - 4:30 pm</option>
</select>
</dd>
<dd>
<label for="Record_End_Time">End Time:</label>
<select name="Record_End_Time" id="Record_End_Time" onchange="checktime()">
<option selected value="0830">0830 - 8:30 am</option>
<option value="0900">0900 - 9:00 am</option>
<option value="0930">0930 - 9:30 am</option>
<option value="1000">1000 - 10:00 am</option>
<option value="1030">1030 - 10:30 am</option>
<option value="1100">1100 - 11:00...
JavaScript
window.checktime = function() {
//start time
var start_time = $("#Record_Start_Time").val();
//end time
var end_time = $("#Record_End_Time").val();
//by this you can see time stamp value in console via firebug
console.log("Time1: " + start_time + " Time2: " + end_time);
if (start_time > end_time) {
console.log( $("#Record_Start_Time"));
$("#Record_Start_Time").after('<span class="error"><br>Start-time must be smaller then End-time.</span>');
$("#Record_End_Time").after('<span class="error"><br>End-time must be bigger then Start-time.</span>');
return false;
} else {
$('.error').remove();
}
};