title: Unable to perform the on click event
body: <p>With reference to the following link <a href="http://jsfiddle.net/Xtreu/" rel="nofollow">http://jsfiddle.net/Xtreu/</a> , I am trying to do same functionality with on click event "Delete My Data" button with out using any form. I tried in different ways but it does not happened. Can Any one help me how to do the same example with on click event?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form method="post" action="/echo/html/"&gt;
      &lt;input type="hidden" name="html" value="&amp;lt;p&amp;gt;Your data has been deleted&amp;lt/p&amp;gt;" /&gt;
      &lt;input type="submit" value="Delete My Data" /&gt;
  &lt;/form&gt;
  &lt;div id="confirmBox"&gt;
      &lt;div class="message"&gt;&lt;/div&gt;
      &lt;span class="button yes"&gt;Yes&lt;/span&gt;
      &lt;span class="button no"&gt;No&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Java script:</p>
  
  <pre><code>function doConfirm(msg, yesFn, noFn) {
      var confirmBox = $("#confirmBox");
      confirmBox.find(".message").text(msg);
      confirmBox.find(".yes,.no").unbind().click(function () {
          confirmBox.hide();
      });
      confirmBox.find(".yes").click(yesFn);
      confirmBox.find(".no").click(noFn);
      confirmBox.show();
  }
  
  $(function () {
      $("form").submit(function (e) {
          e.preventDefault();
          var form = this;
          doConfirm("Are you sure?", function yes() {
              form.submit();
          }, function no() {
              // do nothing
          });
      });
  });
  </code></pre>