JSFiddle - React, Tailwind, and code Playground

HTML

Upload<input type="file" id="fileUpload" style="display:block;margin-top: -20px;opacity: 0;" >
    
    <span id='spanFileName'></span>

CSS

label input[type="file"] 
{
display: block;
margin-top: -20px;
opacity: 0;
}

JavaScript

$('#fileUpload').on("change",function () {
                  
                    var fileExtension = ['jpeg', 'jpg'];
                    if ($.inArray($(this).val().split('.').pop().toLowerCase(), fileExtension) == -1) {
                        // alert("Only '.jpeg','.jpg' formats are allowed.");
                        $('#spanFileName').html(this.value);
                        $('#spanFileName').html("Only '.jpeg','.jpg' formats are allowed.");
                    }
                    else {
                        $('#spanFileName').html(this.value);
                       //do what ever you want
                    } 
     })