I have a form validation code for which it is supposed to give a red background color if someone leaves it empty or enters an integer in the first name input text box, the code is working but for some reason whenever I hit submit it turns red for less than a second a goes away. How can i make the text box appear red permanently. The HTML and JavaScript codes are below, if someone can help that would be appreciated
HTML
<html>
<head>
<script src="Scripts/Asgn_3_2.js"></script>
</head>
<body>
<form name="registration">
<div>
First Name:<input type="text" placeholder="Enter Your First Name"
size="20" id="fname" /><br/><br/>
Last Name:<input type="text" placeholder="Enter Your Last Name"
size="20" id="lname"/><br/><br/>
Gender: <input type="radio" value="Male" id="mgender" />Male   
<input type="radio" value="Female" id="fgender" />Female <br/><br/>
<select>
<option>AL</option>
<option>CA</option>
<option>FL</option>
<option>IL</option>
<option>KS</option>
<option>MN</option>
</select> <br/><br/><br/><br/>
<input type="checkbox" value="I Accept the terms"/>I Accept the terms
<br/><br/>
<button onclick="submitbutton()">Submit</button>
</div>
</form>
</html>
JAVASCRIPT
function submitbutton(){
if (document.getElementById("fname").value == 0){
document.getElementById("fname").style.backgroundColor="red";
}
else if (!isNaN(document.getElementById("fname").value)){
document.getElementById("fname").style.backgroundColor="red";
}
if (document.getElementById("lname").value == 0){
document.getElementById("lname").style.backgroundColor="red";
}
else if (!isNaN(document.getElementById("lname").value)){
document.getElementById("lname").style.backgroundColor="red";
}
}