JSFiddle - React, Tailwind, and code Playground

by Vinay Pratap Singh Bhadauria

HTML

<div id="Create">Create Element</div>
<div id="result">Result</div>

JavaScript

$("body").on("click", "#Create", function () {
    // generates a button
    $("#result").append("<button class='upload'>Upload</button>" +
        "<input type='file' id='hidden'><span></span>");
});

$("body").on("click", ".upload", function () {
    // which alters the element previously created by the .on() even before.
    var input = $(this).next("input");
    $(input).click();


    //$(input).next("span").html(upload);
});

$('body').on("change", "#hidden", function (){
    var upload = $(this).val();
    $(this).next("span").html(upload);
});