input error

input error after 6 caracters

by Megi93

HTML

<input type="text">
<div class="error">Error</div>

CSS

input[type="text"] {
    padding: 10px;
    border: 1px solid #ccc;
	outline:none;
}

.error{
    display:none;
    color:red;
	font-weight: bold;
}

JavaScript

var element = document.querySelector("input");
var errorInput = document.querySelector(".error");

addEventListener("keypress", function lengthOfElement() {
	if(element.value.length >= 6) {
		errorInput.style.display = "block";
		element.style.color = "red";
		element.style.border = "2px solid red";
	} else {
		errorInput.style.display = "none";
		element.style.border = "2px solid blue";
		element.style.color = "blue";
	}
});