JSFiddle - React, Tailwind, and code Playground

HTML

<form action="" class='form'>
    <input data-input-counter type="text" placeholder="Enter number of inputs" />
    <div data-input-container></div>
</form>

JavaScript

var container = $('[data-input-container]'),
    input = $('<input type="text" required />');
$('[data-input-counter]').change(function(){
    // get trimmed value
    var val = Number(this.value.replace(/^\s+/, '').replace(/^\s+/, ''));
    $('input[type=text]', container).remove();
    if (!isNaN(val)) {
        for(var i = 0;i<val;i++) {
            container.append(input.clone());
        }
    }
})