JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="button">Button</div>
    <input type="file" />
</div>
<div id="notice">Nothing to upload</div>

CSS

#button
{
   
    width: 100px;
    height: 50px;
    background-color: #0f0;
}

#wrapper
{
    width: 200px;
    height: 50px;
    overflow: hidden;
    cursor: pointer;
}

JavaScript

$(document).ready(
    function()
    {
        $("#button").on("click",function()
                                {
                                    $("input").click();
                                });
        $("input").on("change",function()
                      {
                          alert($("input"));
                          $("#notice").html("uploading");
                      });
    });