JSFiddle - React, Tailwind, and code Playground

by Noam Paz

HTML

<input type="text" value="" name="phone" />
<div class="x">enter valid number</div>

JavaScript

$(document).ready(function () {
    $("input[name='phone']").keypress(function(event) {
        if (event.charCode  > 57 || event.charCode  < 48) return false;
        if ($("input[name='phone']").val().length == 7) return false;
        if ($("input[name='phone']").val().length == 6) {
             $(".x").hide();   
        } else {
             $(".x").show(); 
        }
    });
    
    $("input[name='phone']").keydown(function(event) {
        if (event.which == 8) {
                $(".x").show();
        }
    });
});