JSFiddle - React, Tailwind, and code Playground

by ilyador

HTML

<form id="qc" name="qc">
<h2>Create New Question!</h2>
<div id="ansInput0">Question: <input type="text" name="Question" /></div><!--question-->
<input type="submit" value="Submit" />
</form>

JavaScript

$(document).ready(function() {
    questionsForm();
});


String.prototype.format = function() {
    var formatted = this;
    for (z=0; z< arguments.length; z++) {
        var regexp = new RegExp('\\{'+z+'\\}', 'gi');
        formatted = formatted.replace(regexp, arguments[z]);
        }
    return formatted;
}

function questionsForm() {
    $("#qc>div:last-of-type>input").live('keyup', function() {
        
        QlineNum = $('#qc>div').length;
        QnewLine = ("<div id='ansInput{0}'>Answer {0}: <input type='text' name='ans{0}' /></div><!--ans1-->").format(QlineNum);
        
    if (QlineNum <= 4 && $(this).val() !== ''){$(this).parent().after(QnewLine);}
    if (QlineNum > 1 && $(this).val() === ''){$(this).parent().remove();}
    });
}