JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <input type="file" id="file1" />
    <input type="file" id="file2" />
    <input type="button" id="validate" value="Validate" />
</form>

JavaScript

function getExt(filename) {
    var dot_pos = filename.lastIndexOf(".");
    if (dot_pos == -1) {
        return "";
    }
    return filename.substr(dot_pos + 1).toLowerCase();
}

function validate_ext() {
    var filename = document.getElementById("file1").value;
    var filename2 = document.getElementById("file2").value;
    var ext = getExt(filename);
    var ext2 = getExt(filename2);
    if (!((ext == "pdf") || (ext == "jpg") || (ext == "jpeg") || (ext == "png"))) {
        alert("Please upload files in correct format only.");
        return false;
    }

    if (filename2 != "") {
        if (((ext2 == "pdf") || (ext2 == "jpg") || (ext2 == "jpeg") || (ext2 == "png"))) {
            alert("Please upload files in correct format only.");
            return false;
        }
    }
    
    return true;
}

$(document).ready(function() {
    $('#validate').click(validate_ext);
});