JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/1.8rc3/themes/base/jquery-ui.css">
<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>

JavaScript

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));
})