JSFiddle - React, Tailwind, and code Playground

HTML

StartTime: <input type="text" name="StartTime" id="StartTime" size="30" value="08:00:00" />
<br>
<br>
EndTime:
<input type="text" name="EndTime" id="EndTime" size="30" value="16:00:00" />

JavaScript

function validateEndTimeGreaterStartTime() {
    var valueStartTime = document.getElementById( 'StartTime' ).value;
    var valueEndTime = document.getElementById( 'EndTime' ).value;
    return Date.parse( '01/01/2015 ' + valueEndTime ) > Date.parse( '01/01/2015 ' + valueStartTime );
};

var elementStartTime = document.getElementById( 'StartTime' );
var elementEndTime = document.getElementById( 'EndTime' );
elementStartTime.onchange = function() {
    if ( validateEndTimeGreaterStartTime() ) {
        elementEndTime.style.color = "black";
    } else {
        elementEndTime.style.color = "red";
    }
};
elementEndTime.onchange = function() {
    if ( validateEndTimeGreaterStartTime() ) {
        elementEndTime.style.color = "black";
    } else {
        elementEndTime.style.color = "red";
    }
};