<!DOCTYPE html>
<html>

  <head>
    <script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script data-require="bootstrap@3.1.1" data-semver="3.1.1" src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <script src="http://rawgithub.com/makeusabrew/bootbox/master/bootbox.js"></script>
    <link data-require="bootstrap-css@3.1.1" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
  
    <button id="bootbox" class="btn">Open confirm</button>
    
  </body>

</html>
$(document).ready(function() {
  $("#bootbox").on("click", function(event) {
    bootbox.confirm({
            title: "danger - danger - danger",
            message: "Your custom message here",
            buttons: {
                cancel: {
                    label: "Cancel or something",
                    className: "btn-default pull-left"
                },
                confirm: {
                    label: "Delete or something",
                    className: "btn-danger pull-right"
                }
            },
            callback: function(result) {
                if (result) {
                    alert("confirm ok");
                } else {
                    alert("confirm cancel");
                }
            }
        });
  });
});
/* Styles go here */

body {
  padding: 10px;
}