Dynamically create Bootstrap alerts box through JavaScript

Question

I'm using Bootstrap 2.0 for my project and I would like to dynamically add Bootstrap alert box in my page (http://twitter.github.com/bootstrap/javascript.html#alerts). I want to do something like:

bootstrap-alert.warning("Invalid Credentials");  

Answer 1

Try this (see a working example of this code in jsfiddle: http://jsfiddle.net/periklis/7ATLS/1/)

<input type = "button" id = "clickme" value="Click me!"/> <div id = "alert_placeholder"></div> <script> bootstrap_alert = function() {} bootstrap_alert.warning = function(message) {             $('#alert_placeholder').html('<div class="alert"><a class="close" data-dismiss="alert">×</a><span>'+message+'</span></div>')         }  $('#clickme').on('click', function() {             bootstrap_alert.warning('Your text goes here'); }); </script>​ 

EDIT: There are now libraries that simplify and streamline this process, such as bootbox.js