JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-transition.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-modal.js"></script>
<div>
    <p class="btn btn-primary btn-large" data-toggle="modal" href="#firstmodal">Launch modal</p>  

</div>

<div id="firstmodal" class="modal hide">
    <div class="modal-header">
     <a href="#" class="close" data-dismiss="modal">&times;</a>
     <h3>First modal</h3>
    </div>
    <div class="modal-body">
        <p>First modal body…</p>
    </div>
    <div class="modal-footer">
        <div class="row">
        <button class="btn" onClick="return closeModal('#firstmodal')">Close</button>
     <a id="jumptosecondmodal" class="btn btn-success btn-medium" href="#">reveal second modal!</a>
         </div>
    </div>   
    
</div>


<div id="secondmodal" class="modal hide">
    <div class="modal-header">
     <a href="#" class="close" data-dismiss="modal">&times;</a>
     <h3>Second modal</h3>
    </div>
    <div class="modal-body">
        <p>Second modal body…</p>
    </div>
    <div class="modal-footer">
        <div class="row">
        <button class="btn" onClick="return closeModal('#secondmodal')">Close</button>
     <a id="jumptothirdmodal" class="btn btn-success btn-medium" href="#">reveal third modal!</a>
         </div>
    </div>   
    
</div>


<div id="thirdmodal" class="modal hide">
    <div class="modal-header">
     <a href="#" class="close" data-dismiss="modal">&times;</a>
     <h3>Second modal</h3>
    </div>
    <div class="modal-body">
        <p>second modal body…</p>
    </div>
</div>

CSS

#firstmodal {
  width: 400px;
  height: 200px;
  z-index: 10001;
}

#secondmodal {
  width: 400px;
  height: 200px;
  z-index: 10002;
}

#thirdmodal {
  width: 400px;
  height: 200px;
  z-index: 10002;
}

JavaScript

function closeModal(modal) {;
  $(modal).modal('hide');
}

$('#jumptosecondmodal').click(function(e) {
    $('#firstmodal').fadeOut(400, function(){
        $(this).modal('hide')
        $('#secondmodal').fadeIn().modal('show')
    });
});

$('#jumptothirdmodal').click(function(e) {
    $('#secondmodal').fadeOut(400, function(){
        $(this).modal('hide')
        $('#thirdmodal').fadeIn().modal('show')
    });
});