Code snippets from: http://adtennant.co.uk/blog/2014/04/25/uploading-files-to-salesforce-with-html5-and-javascript/

gistfile1.html

<input id="file-input" type="file" />
<input id="upload-button" type="button" value="Upload" onclick="uploadFile();"/>

gistfile10.js

att.Body = (new sforce.Base64Binary(binary)).toString();

gistfile11.js

sforce.connection.create([att], {
    onSuccess : function(result, source) {
        if (result[0].getBoolean("success")) {
            console.log("new attachment created with id " + result[0].id);
        }
        else {
            console.log("failed to create attachment " + result[0]);
        }
    },
    onFailure : function(error, source) {
        console.log("an error has occurred " + error);
    }
});

gistfile12.js

reader.readAsArrayBuffer(f);

gistfile2.html

<script type="text/javascript">
    var __sfdcSessionId = '{!GETSESSIONID()}';
</script>
<script src="/soap/ajax/30.0/connection.js" type="text/javascript"></script>

gistfile3.js

var input = document.getElementById('file-input');

gistfile4.js

var filesToUpload = input.files;

gistfile5.js

for(var i = 0, f; f = filesToUpload[i]; i++) {
}

gistfile6.js

var reader = new FileReader();
// Keep a reference to the File in the FileReader so it can be accessed in callbacks
reader.file = f;

gistfile7.js

reader.onload = function(e) {
}

gistfile8.js

var att = new sforce.SObject("Attachment");
att.Name = this.file.name;
att.ContentType = this.file.type;
att.ParentId = "YOUR-PARENT-ID-HERE";

gistfile9.js

var binary = "";
var bytes = new Uint8Array(e.target.result);
var length = bytes.byteLength;
for (var i = 0; i < length; i++) {
    binary += String.fromCharCode(bytes[i]);
}