How to clear input type=file field?

Question

css

https://jsfiddle.net/katyamsko/vhkxoa7q/12/ - put the code here.
Hello! Can you please tell me why the input type=file field is not being cleared? I make a label and input and link them. I hide the input, because I don’t need the standard one, but I style the label. But I need to clear the field on the button when the user has uploaded the file. I looked for ways, but they do not work for me (

Answer 1

Answer 2

the input is cleared, it’s just that the label changes separately when you select a file, and when you clear the input, you don’t clean the label
if you remove all styling and leave only this JS, then you can see that everything works

document.querySelector('.remove').addEventListener('click', function() {
  document.querySelector('input[type=file]').value = '';
}, false);