Cambio en el código para que se muestre gráficamente <script type="text/javascript"> //console.log(document.getElementsByName("fecha1")); function cambio(input){ var inputs = document.getElementsByTagName("input"); console.log(input.value); var inputInt; for (var i = 0; i < inputs.length; i++) { if (inputs[i] == input) { inputInt = i; } } if (inputInt > 0) { if (inputs[inputInt -1 ].value > input.value) { input.style.background= "red"; } else { input.style.background= "green"; } } else { input.style.background= "green"; } } </script> Todos los input deben ir de esta forma. <table> <tr> <td> <input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)"> </td> </tr> <tr> <td> <input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)"> </td> </tr> <tr> <td> <input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)"> </td> </tr> <tr> <td> <input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)"> </td> </tr> </table> Una vez que veas que funcionó cambia los valores de los input por los tuyos. Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función js revisa todos los inputs