JSFiddle - React, Tailwind, and code Playground
HTML
<input type="file" id="image1">
JavaScript
$('#image1').change(function(event) {
console.log('change');
checkExtensions(this.files[0].name, $(this)); // note, I removed .get()
});
function checkExtensions (fileName, $element) {
var allowedExtensions = new Array ('pdf','gif','jpg','png');
var currentExtension = fileName.split('.').pop();
if ($.inArray (currentExtension, allowedExtensions) > -1) {
console.log('OK');
// everything is OK, further instructions take place
} else {
// reset the file input element
console.log('Replaced');
$element.replaceWith($element.clone(true).val(''));
}
}