JSFiddle - React, Tailwind, and code Playground

HTML

<label for="User_file_upload">File Upload</label>

<input id="ytUser_file_upload" type="hidden" value="" name="User[file_upload]">
<input name="User[file_upload]" id="User_file_upload" type="file">

JavaScript

marker = $('<span />').insertBefore('#ytUser_file_upload');
$('#ytUser_file_upload').detach().attr('type', 'text').insertAfter(marker).focus();
marker.remove();