JSFiddle - React, Tailwind, and code Playground
HTML
<div class="fileupload">
<input type="file" class="file" name="image" />
</div>
<div class="fileupload">
<input type="file" class="file" name="attachement" />
</div>
CSS
.fileupload {
background: rgb(230, 230, 230);
padding: 30px;
margin: 10px;
}
input {
border: 2px solid rgb(180, 180, 180);
}
JavaScript
$('.fileupload').click(function(e) {
$(this).find('input[type="file"]').click();
});
$('.fileupload input').click(function(e) {
e.stopPropagation();
});