Edit in JSFiddle

$(function () {

    var $btn = $('#btnConfirmar');

    $btn.on("click", function () {
        ShowDialog();
    });

})

function ShowDialog() {
    $('#spanMessage').html('¿Está seguro(a) de guardar los cambios?');
    $("#dialogConfirm").dialog({
        resizable: false,
        height: 140,
        modal: true,
        title: 'Mensaje Modal',
        buttons: {
            'Aceptar': function () {
                $("<div><span>Se guardaron los cambios correctamente</span></div>").appendTo(document.body);
                $(this).dialog("close");
            },
                'Cancelar': function () {
                $(this).dialog("close");
            }
        }
    });
}

External resources loaded into this fiddle:

<div class="ui-state-highlight ui-corner-all">
    <table>
        <tr>
            <td>
                <label>Ejemplo modal</label>
            </td>
            <td>
                <input type="button" id="btnConfirmar" value="Confirmar" class="ui-state-default ui-corner-all" />
            </td>
        </tr>
    </table>
</div>
<div id="dialogConfirm"><span id="spanMessage"></span>

</div>
* {
    font-size:12px;
    font-weight:bold;
}