JSFiddle - React, Tailwind, and code Playground
HTML
<input id="NumOfTextBoxes" type="text" value="0"></input>
<button id="addem">Add Textboxes</button>
<div id="NewlyCreatedSelectBoxes">
</div>
<div id='BtnSet'></div>
JavaScript
function AddingTextBoxes() {
var NumOfText = $("#NumOfTextBoxes").val();
$('#NewlyCreatedSelectBoxes').empty();
for (i = 1; i <= NumOfText; i++) {
var ipBoxName = "MyInput" + i;
var $div = $('<div/>').addClass('jsRow');
var txtBoxAutoNumbering = "<input type='text' name='textbx[]' id='TxtBx" + i + "' style='width:50px;' value=" + i + " /> ";
$div.append(txtBoxAutoNumbering);
var txtBox = "<input type='text' name='textbx[]'/> "
$div.append(txtBox);
var Select_SelectionOptions = "<select id='SelectOption'><option>Text_Box</option><option>Text_Area</option><option>Radio_Button</option></select> ";
$div.append(Select_SelectionOptions);
var Select_For_Multiple_Choices = "<button type='button' onclick='ChildTxtBoxes(this)' id='Child_Btn" + i + "' value='B'>Click for child selections</button><br>";
$div.append(Select_For_Multiple_Choices);
$div.appendTo($('#NewlyCreatedSelectBoxes'));
}
return false;
}
function ChildTxtBoxes(item) {
$(item).nextUntil('.jsRow').remove();
var retVal = prompt("Enter the number of textboxes need to add");
for (i = 1; i <= retVal; i++) {
$(item).after("<div class='BtnSet' i><input id='TxtID" + i + "' type='text' name='textbx[]'/></div>");
}
}
$('#addem').on('click', AddingTextBoxes);