Javascript / IE8 : file fields created by javascript allows text entry

I ran into an issue in IE8 while creating file fields in javascript for a form. The newly created file field allowed text entry. It didn't matter if I used jQuery or created the field with createElement.

$
var fileField = $('',{
            'id': 'picker-2',
            'type': 'file'});

            $('#fields').append(fileField);

When the field was placed on the screen it allowed users to enter text. This isn't a huge issue, but this shouldn't happen. It doesn't happen when you create the file field through HTML. You can see an example here.

The solution to this problem is cloning the newly created field before appending it to the DOM.

var fileField = $('',{
            'id': 'picker-2',
            'type': 'file'});

$('#fields').append(fileField.clone());

This will make it behave like a normal file field. You can see an example here.