Hello Reader's
In this article I will guide you to create Cross-Browser Custom Upload Button With JQuery
If you facing any problem for upload button use this code.
Here is the HTML

<div class="Container">
        <label>Upload Photo:</label>
        <input class="fileinput" type="file" name="data[User][image][]" style="display:none">
        <span class="button upload">Browse</span>
        <span class="filename"></span>
    </div>

Here is the CSS

.Container{width: 608px;position: absolute;margin-bottom:10px;
            top: 30px;
            margin-left: 15px;}
        .Container label{position: absolute;bottom: 35px;color: #356332;}
        .Container .upload {
            background: #3D7D43;
            color: #fff;
            padding: 7px 10px;
            border-radius: 5px;
            cursor: pointer;
            left: 0px;
            top: 0px;
            display:inline-block;
        }
        .Container .upload:hover {
            background: #000;
        }
        .Container .filename {
            background: #FCF9F2;
            border: 1px solid #b0c2b2; 
            overflow: hidden;
            display: block;
            font-size: 14px;
            font-style: italic;
            left: 80px;
            padding: 6px 7px;
            position: absolute;
            top: 0px;
            width: 200px;
            box-shadow: 2px 2px 2px 0 #D5D4D0 inset;
            color: #ff0000;
            height: 20px;
        }

Here is the JS

$( function() {
            $('body').on('click' ,'.upload', function(){
            $(this).prev('.fileinput').click();

            $(this).prev('.fileinput').change(function() {
                $(this).nextAll('.filename').eq(0).html(
                    $(this).val().substring(
                        $(this).val().lastIndexOf('\\')+1));
                });
            });
        });