JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<div id="cont">

<input class="dynamic-boxes" type="text" placeholder="Start typing something" />

</div>

CSS

input[type="text"]{
  display:block;
  margin-bottom:10px;
}

JavaScript

$(document).ready(function(){
 $('#cont').on('keyup', '.dynamic-boxes', function(){
 		var typed = $(this).val().length;
    if(typed >= 1) // something was typed
    {
    		var hasNext = $(this).next().length;
        
        if(!hasNext) // current textbox doesn't have a next sibling next to it, so insert it
        {
    			$(this).parent().append('<input class="dynamic-boxes" type="text" placeholder="Start typing something" />');
      }
    }    
 });
});