Edit in JSFiddle

Result
HTML
CSS
JavaScript

<div id="message" style="position: absolute; z-index: 1; width: 60%; top:10%; left:20%;"></div>

<div class="container text-center" style="margin-top:120px;">
<button id="submit-button" type="submit" class="btn btn-primary">Submit</button>
</div>

.alert {
    cursor: pointer;
}

var displayMessage = function(text) {
    var message = $('#message');
    var div = $('<div class="alert alert-info alert-dismissible" role="alert" data-dismiss="alert">')
    var button = $('<button type="button" class="close" aria-label="Close">');
    var icon = $('<span aria-hidden="true">&times;</span>');
    button.append(icon);
    message.html(div.append(button).append(text));
    div.hide().fadeIn("");
}

$('#submit-button').click(function() {
    displayMessage('こんにちは世界');
});