JSFiddle - React, Tailwind, and code Playground

by liuyl

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<button class="btn btn-success btn-large btn-large-nice" data-loading-text="Loading..." type="submit">
    <i class="icon-ok icon-white icon-2x"></i>
</button>

CSS

.btn-large-nice {
  width: 30%;
  min-width: 160px;
}

JavaScript

$('button[data-loading-text]')
    .on('click', function () {
        var btn = $(this)
        btn.button('loading')
        setTimeout(function () {
            btn.button('reset')
        }, 3000)
    });