It can easily be done using jQuery if you prefer. Here's the solutions using both javaScript and jQuery.
HTML :
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="button" id="submitButton" value="Submit" />
//for javaScript
<!-- <input type="button" id="submitButton" value="Submit" onclick="validateField();" /> -->
javaScript :
function validateField(){
var textFields = document.getElementsByTagName("input");
for(var i=0; i < textFields.length; i++){
if(textFields[i].type == "text" && textFields[i].value == "")
{
textFields[i].style.backgroundColor = "red";
}
else {
textFields[i].style.backgroundColor = "white";
}
}
}
jQuery :
$("#submitButton").click(function(){
$("input").each(function(){
if($(this).attr("type") == "text" && $(this).val() == "")
{
$(this).css("background-color", "red");
}
else {
$(this).css("background-color", "white");
}
});
});