How to append the name of a file if you are replacing the normal functionality of a file upload button

upload-file-replaced.js

$(window).load(function() {
    $('input[type=file]').on('change', function() {
        var filename = $(this).val().split('\\');
        if($('#filename-information').length > 0) {
            $('#filename-information').html('Selected File: '+filename[filename.length - 1]);    
        } else {
            $(this).parent().append('<div id="filename-information">Selected File: '+filename[filename.length - 1]+'</div>');    
        }
    });
});

This is when we are using a replacement image and making the choose file input not visible. We get the value of the button and place it after the input parent. Will want to change your target in line 2 and possibly the $(this).parent() if you need to place the filename somewhere else.

used this as a guideline: http://www.htmllion.com/custom-file-input-styling-with-css.html