JSFiddle - React, Tailwind, and code Playground

HTML

<div class="call-inner-right-form-row-2">
              <input type="text" name="phone1" class="call-inner-pnone-1" maxlength="1">
              <br><br>
              <input type="text" name="phone1" class="call-inner-pnone-2" maxlength="3">
              <br><br>
              <input type="text" name="phone1" class="call-inner-pnone-3" maxlength="7">
              <div id="contenInput"></div>
            </div>

JavaScript

$(".call-inner-pnone-1").keyup(function() {
 var currentAmountNumbers1 = $(".call-inner-pnone-1").val();
 if( currentAmountNumbers1.length >= 1 ){
  <!-- alert(currentAmountNumbers1.length); -->
  $(".call-inner-pnone-2").click();
 } 
});

$(".call-inner-pnone-2").keyup(function() {
 var currentAmountNumbers2 = $(".call-inner-pnone-2").val();
 if( currentAmountNumbers2.length >= 3 ){
  <!-- alert(currentAmountNumbers2.length); -->
  $(".call-inner-pnone-3").click();
 } else if(currentAmountNumbers2.length == 0){
  $(".call-inner-pnone-1").click();
 }
});

$(".call-inner-pnone-3").keyup(function() {
 var currentAmountNumbers3 = $(".call-inner-pnone-3").val();
 <!-- alert(currentAmountNumbers3.length); -->
 if( currentAmountNumbers3.length == 0 ){
  $(".call-inner-pnone-2").click();
 } 
});