Diálogo personalizado de “confirmação” em JavaScript?

Estou trabalhando em um projeto ASP.net que usa 'diálogos modais' personalizados. Uso citações de medo aqui porque entendo que a 'caixa de diálogo modal' é simplesmente uma div no meu documento html que deve aparecer "na parte superior" do restante do documento e não é uma caixa de diálogo modal no verdadeiro sentido da palavra .

Em muitas partes do site, tenho um código parecido com este:

var warning = 'Are you sure you want to do this?';
if (confirm(warning)) {
    // Do something
}
else {
    // Do something else
}

Isso é bom, mas seria bom fazer com que a caixa de diálogo de confirmação correspondesse ao estilo do restante da págin

o entanto, como não é uma caixa de diálogo modal verdadeira, acho que preciso escrever algo assim: (eu uso a jQuery-UI neste exemplo)

<div id='modal_dialog'>
    <div class='title'>
    </div>
    <input type='button' value='yes' id='btnYes' />
    <input type='button' value='no' id='btnNo' />
</div>

<script>
function DoSomethingDangerous() {
    var warning = 'Are you sure you want to do this?';
    $('.title').html(warning);
    var dialog = $('#modal_dialog').dialog();
    function Yes() {
        dialog.dialog('close');
        // Do something
    }   
    function No() {
        dialog.dialog('close');
        // Do something else
    }    
    $('#btnYes').click(Yes);
    $('#btnNo').click(No);
}

Essa é uma boa maneira de realizar o que eu quero ou existe uma maneira melhor?

questionAnswers(5)

yourAnswerToTheQuestion