jQuery UI dialog only works the first time it's called

I have a simple html code fragment

<div style="display:none;" id="link_to_list"></div>
 <a href="#" onclick="save_onclick()">
     Back to List
 </a>

And a simple jquery function for handling clicking.

function save_onclick() {
    $( "#link_to_list" ).dialog({
        title:'Are you sure you don\'t want to save?',
        resizable: false,
        height:140,

        modal: true,
        buttons: {
            Ok: function() {
                window.location.href = "findUsers";
                $( this ).dialog( "close" );
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        }
    });
}

When I first click, it开发者_JAVA百科 works, but div "link_to_list" erase and i can't call it again. How can i get around this?

I think the problem may be that on the second click you'd be trying to re-initialize the dialog, which (again, if I'm recalling correctly) won't work. Instead, you could set up the dialog first and then have the click handler just open the dialog.

$( "#link_to_list" ).dialog({
    title:'Are you sure you don\'t want to save?',
    resizable: false,
    height:140,
    autoOpen: false,

    modal: true,
    buttons: {
        Ok: function() {
            window.location.href = "findUsers";
            $( this ).dialog( "close" );
        },
        Cancel: function() {
            $( this ).dialog( "close" );
        }
    }
});

function save_onclick() {
  $('#link_to_list').dialog('open');
}

$(this).dialog("destroy")

Remove the dialog functionality completely. This will return the element back to its pre-init state.

$(this).dialog("close")

Close the dialog

http://jqueryui.com/demos/dialog/

Mark's answer works however it does not work if you close with the x button. dont use destroy. set autoOpen to false, make call to dialog then open in a separate call

    $( "#dialog" ).dialog({
        autoOpen: false,
        show: "blind",
        hide: "explode"
    });

    $( "#opener" ).click(function() {
        $( "#dialog" ).dialog( "open" );
        return false;
    });

http://jqueryui.com/demos/dialog/#animated