Using .replaceWith() on dialog box. What's wrong?
<p>I would like to toggle the JQuery <a href="http://jqueryui.com/demos/dialog/#modal-confirmation" rel="nofollow">Dialog</a> using a button.</p>

<p>To replace the text in the dialog I use <a href="http://api.jquery.com/replaceWith/" rel="nofollow">.replaceWith()</a></p>

<p>The problem is, that the text isn't replaced, and the dialog shows up, even when I have set </p>

<pre><code>&lt;div id="dialog-confirm" title="Can you confirm?" style="display: none;"&gt; 
</code></pre>

<p>Here is the code</p>

<pre><code>(function() {
    $( "#dialog:ui-dialog" ).dialog( "destroy" );

    $( "#dialog-confirm" ).dialog({
        resizable: false,
        height:140,
        modal: true,
        buttons: {
            "Okay": function() {
                $( this ).dialog( "close" );
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        }
    });
});

function showhide(iname) {
    var item = document.getElementById(iname).style;
    if (item.display == 'none') {
    item.display = '';
    } else {
    item.display = 'none';
    }
}

$('div.dialog-text').replaceWith( "&lt;b&gt;New text goes here&lt;/b&gt;" );
</code></pre>

<p>and can be tried out live at</p>

<p><a href="http://jsfiddle.net/littlesandra88/XxVtU/" rel="nofollow">http://jsfiddle.net/littlesandra88/XxVtU/</a></p>

<p>Also, if there is a better way, please let me know =)</p>
