security questions made easy (with bootstrap)

bla.html

<a href="/delete/stuff" class="btn btn-delete" data-sure-text="sure?"> delete </a>
            

jquery.usure.js

(function($) {
    /**
     * config: {
     *   dangerClass: 'btn-danger',
     *   sureTextDefault: 'sure?'
     * }
     * @param config
     * @return {*}
     */
    $.fn.usure = function(config) {
        config = config || {};
        config.dangerClass     = config.dangerClass || 'btn-danger';
        config.sureTextDefault = config.sureTextDefault || 'sure?';

        return this.each(function(index, value) {
            $(value).click(function(evt) {

                var btn = $(this);
                var text = btn.data('sure-text') ? btn.data('sure-text')
                                                 : config.sureTextDefault;
                if(btn.data('sure') !== 'yes') {

                    btn.data('sure-old-text', btn.text())
                        .text(text)
                        .addClass('btn-danger')
                        .data('sure', 'yes');

                    setTimeout(function() {
                        btn.text( btn.data('sure-old-text') )
                            .removeClass('btn-danger')
                            .data('sure', 'no');
                    }, 2000);

                    evt.preventDefault();
                    return false;
                }
            });
        })
    }
})(jQuery);

main.js

$(function() {
  $('.btn-delete').usure();
});