JSFiddle - React, Tailwind, and code Playground

by Jeet Chatterjee

HTML

<div id="TextBoxContainer">
<input id="btnAdd" type="button" value="Add" />
</div>

JavaScript

$(function () {
    $("#btnAdd").bind("click", function () {
        var div = $("<div />");
        div.html(GetDynamicTextBox(""));
        $("#TextBoxContainer").append(div);
    });
    $("#btnGet").bind("click", function () {
        var valuesarr = new Array();   
        var phonearr = new Array();  
        var phonearr1 = new Array(); 
        $("input[name=DynamicTextBox]").each(function () {
            valuesarr.push($(this).val());
            $('#DynamicTextBox').val(valuesarr);
        });
        $("input[name=phoneNum]").each(function () {
            phonearr.push($(this).val());
            $('#phoneNum').val(phonearr);
        });
        
        $("input[name=phoneNum1]").each(function () {
            phonearr1.push($(this).val());
            $('#phoneNum1').val(phonearr1);
        });
       
        alert(valuesarr); alert(phonearr);alert(phonearr1);
    });
    
    $("body").on("click", ".remove", function () {
        $(this).closest("div").remove();
    });
    
});

function GetDynamicTextBox(value) {
       return '<input name = "DynamicTextBox" type="text" value = "' + value + '" />&nbsp;<input id="myPicker" class="time" type="text" />&nbsp;<input name = "phoneNum1" type="text" /><input type="button" value="Remove" class="remove" />';
}