jQuery / Twitter Bootstrap data-loading-text button with delay

css, javascript, jquery, twitter-bootstrap

Solution

In the documentation page, there is a file being loaded called application.js. http://twitter.github.com/bootstrap/assets/js/application.js

// button state demo
$('#fat-btn')
    .click(function () {
        var btn = $(this)
        btn.button('loading')
        setTimeout(function () {
            btn.button('reset')
        }, 3000)
    });

Problem

I'm trying to get this exact example working on my website: http://getbootstrap.com/2.3.2/javascript.html#buttons However, simply including this HTML: ``` <button type="button" class="btn btn-primary" data-loading-text="Loading...">Loading state</button> ``` Does not work. I'm running jQuery 1.7.x and have loaded the Bootstrap JS files. To be specific: I want the button to move to the "loading" text change for a slight delay, then go back to the regular text. There doesn't seem to be a good example available online from my Googling (most are asking for a permanent state change or toggle), and the Bootstrap site itself is lacking in documentation here.

Original source