Что-то ТС замолчал... Надо его подбодрить.
Вариации на тему
<div id="container">
<div style="border:1px solid black">
<input type="text" id="new" placeholder="Введите новый контакт" style="margin-left:21px; width: 250px;">
</div>
</div>
<script>
function setRed() {
this.nextSibling.style="display:inline; width: 250px;color:red";
this.style="opacity:0;";
}
function removeThis() {
container.removeChild(this.parentNode);
}
function enableThis() {
this.querySelector('input:disabled').disabled = false;
}
function disableThis() {
this.disabled = true;
}
function checkText(text) {
if(text.length<10) return true;
var arr = text.split(" ");
if (arr.length < 3) return true;
var eMail = arr[arr.length - 1];
var re = /^[\w-\.]+@[\w-]+\.[a-z]{2,4}$/i;
if(!re.test(eMail)) return true;
var phone = '';
for(var i = 1; i < arr.length - 1; i++) {
phone = phone + arr[i];
}
re = /^\d[\d\(\)\ -]{4,14}\d$/;
if(!re.test(phone)) return true;
}
document.querySelector("#new").onchange = function() {
var newText = this.value;
var errorText = checkText(newText);
if(errorText) return;
var newDiv = document.createElement('div');
newDiv.style = "height:22px; border:1px solid black;";
newDiv.ondblclick = enableThis;
container.appendChild(newDiv);
var newInput = document.createElement('input');
newInput.type = "checkbox";
newInput.style = "display:inline;";
newInput.onclick = setRed;
newDiv.appendChild(newInput);
newInput.focus();
newInput = document.createElement('input');
newInput.value = newText;
newInput.style = "display:inline; width: 250px;";
newInput.onchange = disableThis;
newInput.disabled = "true";
newDiv.appendChild(newInput);
newInput = document.createElement('input');
newInput.type = "button";
newInput.style = "display:inline; border:1px solid red; border-radius:10px; color:red;";
newInput.value="X";
newInput.onclick = removeThis;
newDiv.appendChild(newInput);
this.value = "";
}
</script>