Remove upload file from input jQuery

Question

HTML code:

<img src="../img/attach.png" id="upfile1" style="cursor:pointer">
    <input type="file" id="file1"  name="file1" style="display:none">

jQuery:

$("#file1").change(function(){
        var arr = $('#file1')[0];
        var fileName = $('#file1')[0].files[0].name;
        var fileName2 = $('#file1')[0].files[0].size;
        fileName2 /= 100000;
        var size = fileName2.toFixed(2);
        if(fileName){
            $(".attach").html("1. <span class='fileName'>"+ fileName + "</span> " +size+ "Mb Loaded <img src='../img/bin.png'>").css("display","block");
            $(".attach img").on("click", function() {
                delete arr.files[0];
                console.log(arr.files[0]);
            });
        }
    });

I need to remove upload file after clicked on img... Can I do it use jQuery or I need some library such a Basic plus UI. Thanks a lot.

Answer 1

You can use $('#file1').val('');.

Answer 2

$('#upfile1').on('click',function(){
    $('#file1').remove();
});