Untitled

<!DOCTYPE html>
<html>
<head>
    <title>Numere de telefon</title>
    <style>
        .invalid {
            background-color: rgb(139,0,0,0.2);
            color: darkgreen;
            border: 1px green solid;
        }
    </style>
    <script>
        function minL(elem,event,nr){
            var v = elem.value;
            if(v.length < nr ){
                elem.classList.add("invalid");
            } else if (v.length > nr) {
                elem.classList.add("invalid");
            } else {
                elem.classList.remove("invalid");
            }
        }

         function addInput(elem,event){
            event.preventDefault();
            var container = document.querySelector("#containerNrTel");
            if(minL(document.querySelector("[name=numarTelefon]"))){
                container.innerHTML += '<input type="text" placeholder="nr telefon" />';
            }

        }

    </script>
</head>
<body>
    <form>
    <fieldset>
        <legend>Cont nou</legend>
        <input type="text" placeholder="nume">
        <input type="text" placeholder="prenume">
        <input type="text" placeholder="nr telefon" name="numarTelefon" oninput="" onchange="minL(this,event,10);">
        <input type="button" value="+" onclick="addInput(this,event);">
        <div id="containerNrTel"></div>
        <input type="button" value="Submit">
    </fieldset>
    </form>
</body>
</html>