title: javascript - click is not a function error
body: <p>i am creating a confirmation box where users will click delete and it will ask then if they are sure or not.</p>
  
  <p>this is the html</p>
  
  <pre><code>    &lt;a href="" class="delete"  &gt;Delete&lt;/a&gt;
  </code></pre>
  
  <p>this is the JS handler</p>
  
  <pre><code>        (function($){
                var deleteBox = '&lt;span class="deleteBox"&gt;&lt;p&gt;Are you sure you want to delete?&lt;/p&gt;&lt;span class="cancel"&gt;Cancel&lt;/span&gt;&lt;span class="confirm"&gt;Yes&lt;/span&gt;&lt;/span&gt;';
                $(document).on('click', '#deleteproduct', (function(){
                  $(this).append(deleteBox);
                }).click(function(){
                  if(!$(this).hasClass('selected')){
                    $(this).addClass('selected');
                    var owner = $(this);
  
                    $(this).find('.cancel').unbind('click').bind('click',function(){
                      owner.removeClass('selected');
                      return false;
                    })
  
                    $(this).find('.confirm').unbind('click').bind('click',function(){
                      $(this).parent().addClass('loading');
                      var parent = $(this).parent();
  
                      //ajax to delete
  
                      setTimeout(function(){ //On success
                        parent.addClass('deleted');
                        setTimeout(function(){
                          owner.fadeOut(600);
  
                          //remove item deleted
  
                          setTimeout(function(){
                            owner.find('.deleted').removeClass('loading').removeClass('deleted');
                            owner.removeClass('selected');
                            owner.show();
                          },1000) 
                        },1000)
                      },1000)
  
                      return false;
                    })
                  }   
                  return false;
                }));
        })(jQuery);
  </code></pre>
  
  <p>this is the error its showing </p>
  
  <pre><code>   TypeError: (intermediate value).click is not a function at this line   ......  }).click(function(){
  </code></pre>
  
  <p>how can I fix this error?</p>