JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<div>
		<button id='alertBtn' class='btn btn-danger'>Show Alert</button>
		<button id='chainedBtn' class='btn btn-general'>Multiple Depth Modal</button>
		<button id='confirmBtn' class='btn btn-warning'>Show Confirm</button>
		<button id='promptBtn' class='btn btn-primary'>Prompt Something</button>
		<button id='formBtn' class='btn btn-success'>Show Modal Form</button>
	</div>

	<div id='pageForm' style='display: none'>
		<form class="form-horizontal">
			<div class="control-group">
				<label class="control-label" for="inputEmail">Email</label>
				<div class="controls">
					<input type="text" id="inputEmail" placeholder="Email">
				</div>
			</div>
			<div class="control-group">
				<label class="control-label" for="inputPassword">Password</label>
				<div class="controls">
					<input type="password" id="inputPassword" placeholder="Password">
				</div>
			</div>
			<div class="control-group">
				<div class="controls">
					<label class="checkbox">
						<input type="checkbox"> Remember me
					</label>
				</div>
			</div>
		</form>
	</div>

CSS

button
{
    margin: 20px 5px;
}

JavaScript

// =============
/*
		Copyright Konglie
		[email protected]

		But, you are free to use, and/or modify or even do whatever you like with these codes.
		*/
function maxZ()
{
    var m = [0];
    $('body > *').each(function(){
        if(/position|fixed/.test($(this).css('position')))
        {
            var z = parseInt($(this).css('z-index'));
            if(isNaN(z)) z = 0
            m.push(z);
        }
    });
    
    return Math.max.apply(null, m);
}

$.fn.modal.Constructor.prototype.enforceFocus = function () {};
function showModal(title, comp, buttons)
{
    var d = $('<div>').addClass('modal hide fade').appendTo('body');
    var head = $('<div>').addClass('modal-header').appendTo(d);
    $('<button>').addClass('close')
    .attr('data-dismiss', 'modal').attr('aria-hidden', true).text('x').appendTo(head);
    $('<h3>').appendTo(head).text(title);
    
    var body = $('<div>').addClass('modal-body').appendTo(d);
    
    if(! comp.jquery)
    {
        $(body).html( comp );
    }
    else
    {
        $(comp).data('pre-parent', $(comp).parents().get(0));
        $(comp).appendTo(body).show();
    }
    
    var footer = $('<div>').addClass('modal-footer').appendTo(d);
    if($.isPlainObject(buttons))
        buttons = [ buttons ];
    
    if($.isArray(buttons) && buttons.length > 0)
    {
        for(var i in buttons)
        {
            var button = buttons[ i ];
            var btn = $('<button>').appendTo(footer).text(button.text);
            if(typeof button.cls != 'undefined')
                $(btn).addClass('btn ' + button.cls);
            else
                $(btn).addClass('btn btn-primary');
            
            if($.isFunction(button.fx))
            {
                $(btn)
                .data('fx', button.fx)
                .click(function(e){
                    $(this).data('fx')( $(this).parents('.modal') );
                    return false;
                });
            }
        }
    }
    
    $(d)
    .on('hidden',...