Twitter bootstrap alert change class

Question

I have created an alert in Twitter Bootstrap this way

HTML:

<div id='alert' class='hide'></div>

JS:

function showAlert(message) {
    $('#alert').html("<div class='alert alert-error'>"+message+"</div>");
    $('#alert').show();
}
showAlert('Please have a look at yourself.');
$('#alert').removeClass('alert-error');
$('#alert').addClass('alert-info');

But the last two lines of javascript don't seem to have any effects, can anyone have a look for me?

Created jsfiddle here.

Update I made some changes in my own code to make it easier to use, I prefer this way

HTML:

<div id='alert' class='hide'></div>

JS:

function showAlert(message, alertType) {
  $('#alert').html("<div class='alert alert-"+alertType+"'>"+message+"</div>");
  $('#alert').show();
}

showAlert('Please have a look at yourself.', 'success');

New jsfiddle here

Answer 1

$('#alert div').removeClass('alert-error');
$('#alert div').addClass('alert-info');

http://jsfiddle.net/Cf4gs/2/

Answer 2

Last two javascript lines are working.

However you really wanted to do this: JSFiddle

$('.alert-error').removeClass('alert-error').addClass('alert-info');