JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<a class='btn btn-large btn-success upload'>
  <i class='icon-upload icon-white'></i>
  Upload!
</a>

<h2>Files</h2>
<div class='alert alert-info'><strong>Hey.</strong> Upload a file!</div>
<ul class='unordered files'>
</ul>

<form class='uploader' action='/echo/json/'>
  <fieldset>
    <input type='file' multiple='multiple' />
  </fieldset>
</form>

CSS

body {
  padding: 25px;
}

ul {
  list-style-type: square;
}

.upload {
  float: right;
}

.uploader {
  display: none;
}

JavaScript

$('.upload').on('click', function() {
  $('.uploader input:file').click();
});

$('.uploader input:file').on('change', function() {
  $this = $(this);

  $('.alert').remove();
        
  $.each($this[0].files, function(key, file) {
    $('.files').append('<li>' + file.name + '</li>');

    data = new FormData();
    data.append(file.name, file);

    $.ajax({
      url: $('.uploader').attr('action'),
      type: 'POST',
      dataType: 'json',
      data: data
    });
  });
});