JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
<div class="container">
<div class="row">
<div class="span12">
<div id="alert-section" class="alert alert-success">
<button type="button" class="close" data-dismiss="alert">×</button>
<h4>Page load alert!</h4>
This alert is displayed when page loads.
</div>
<button type="button" id="btn-alert" href="#">Open my alert</button>
<div id="le-alert"></div>
</div>
</div>
</div>
JavaScript
$('#btn-alert').click(function () {
$('#le-alert').addClass('alert in');
$('#le-alert').append('<button type="button" class="close" data-dismiss="alert">×</button><h4>Alert title</h4><p>This alert is dispalyed on button click</p>');
});
$('.close').click(function () {
$(this).parent().removeClass('alert in');
$(this).parent().empty();
});