JSFiddle - React, Tailwind, and code Playground

by Spokey

HTML

<input name="txtSection" type="text" onfocus="this.value=''" placeholder="sections" />
<br/>
<div class="form-inputs">
    <input name="txtTopicName1" class="section-topic-field" type="text" onfocus="this.value=''" placeholder="topic name #1" />
    <br />
</div>
<!--<button class="btn btn-mini btn-primary" type="submit">Create</button>-->

JavaScript

$(document).ready(function (e) {
    var i = $('.form-inputs input').size() + 1;

    $('.form-inputs').on('keyup', '.section-topic-field:last', function (e) {
        if ($(this).val() != "") {
            var html_new_field = '<input name="txtTopicName' + i + '" class="section-topic-field" type="text" onfocus="this.value=\'\'" placeholder="topic name #' + i + '" /><br />';

            $('.form-inputs').append($(html_new_field).fadeIn('slow'));

            i++;
        }
    });
});