如何构建一个可以在应用程序中的任何位置工作的用于确认（是/否）的 jQuery 对话框？

我有以下内容：

<ol id="listItems>
    <li id="listItem-1">
        <span class="title">Item 1</span>
        <span class="delete">delete</span>
    </li>
    <li id="listItem-2">
        <span class="title">Item 2</span>
        <span class="delete">delete</span>
    </li>
    <li id="listItem-3">
        <span class="title">Item 3</span>
        <span class="delete">delete</span>
    </li>
    <li id="listItem-4">
        <span class="title">Item 4</span>
        <span class="delete">delete</span>
    </li>
</ol>

我在这里想做的是任何时候单击 .delete，我想显示一个 jQuery ui 对话框进行确认，是或否...如果用户说是，则继续单击删除，它将按原样删除今天。

如何构建一个静态的 jQuery UI 对话框并且适用于任意数量的列表项？更好的是适用于我的应用程序中的任何内容，因此它不仅仅是特定于列表的。

有想法吗？谢谢

使用 JQuery UI 对话框的示例 -

Demo - http://jsfiddle.net/CdwB9/3/ http://jsfiddle.net/CdwB9/3/

function yesnodialog(button1, button2, element){
  var btns = {};
  btns[button1] = function(){ 
      element.parents('li').hide();
      $(this).dialog("close");
  };
  btns[button2] = function(){ 
      // Do nothing
      $(this).dialog("close");
  };
  $("<div></div>").dialog({
    autoOpen: true,
    title: 'Condition',
    modal:true,
    buttons:btns
  });
}
$('.delete').click(function(){
    yesnodialog('Yes', 'No', $(this));
})

随着直播——

Demo - http://jsfiddle.net/CdwB9/4/ http://jsfiddle.net/CdwB9/4/

$('.delete').live('click', function(){
    yesnodialog('Yes', 'No', $(this));
})