Duplicate File Upload Buttons

In response to: http://stackoverflow.com/questions/29539735/clone-css-styled-file-upload-buttons

HTML

<label id="img1" class="uploadbutton">Choose File
    <input type="file" name="img1"/>
</label>

<button id="add">+</button>

CSS

td {
    width: 100px;
}

input[type='file'] {
    display: none;
}

#img2 {
    color: red;
}

#img3 {
    color: blue;
}

.uploadbutton {
    margin-right: 25px;
    padding: 6px 15px 6px 15px;
    cursor: default;
    color: #000;
    font-size: 15px;
    text-align: center;
    border: 1px solid #000;
    border-radius: 20px;
}

JavaScript

var addcounter = 2;
$("#add").on('click', function (e) {
    
    //Create a new select box
    $('#img1')
        .clone()
        .attr({
            id: "img" + addcounter
        })
        .insertBefore($('#add'))
        .find("input")
        .attr({
            name: "img" + addcounter
        });
    addcounter++;
});