title: Why is this jQuery ajax click event firing multiple times?
body: <p>I have tried unbinding the click event, but it fires sometimes twice sometimes 5 times!! Getting a bit fed up now!</p>
  
  <p>Code from <code>modal.asp</code></p>
  
  <pre><code>$("input[name=add_associate]").live("click",function(){
      var addassociateID = $(this).attr("id")
  
      $.ajax({
         type: 'POST',
         url: '/data/watchlist_save.asp',
         data: {m : 'share_watchlist_add', watchListID : &lt;%=WatchListID%&gt;, a : addassociateID},
         async:true,
         success: function(data) {
             $(".associate_users").load("/data/sub_watch_members.asp?watchListID=&lt;%=WatchListID%&gt;",
             {cache:false},function() {
                 $(".search_note").html(data)         
                 $(this).unbind('click').bind('click',handler);                                                                                                
             })
         },
         error: function(data){
             $(".search_note").html(data)
         }
      });     
  })
  </code></pre>
  
  <p><strong>UPDATE</strong>:<br />
  Basically I am calling the following code into <code>.associate_users</code></p>
  
  <pre><code>&lt;div id="associate_list"&gt;
      &lt;div class="associate_record"&gt;
          &lt;div class="left" style="padding:8px;"&gt;&lt;img src="../imgs/nopic-m.png" style="width:30px;height:30px;" class="img_border" /&gt;&lt;/div&gt;
          &lt;div class="left" style="padding-top:15px;"&gt;5)Neil Burton&lt;/div&gt;
          &lt;div class="right" style="padding-top:10px;margin-right:5px;"&gt;&lt;input type="button" class="btn-blue" name="add_associate" id="890" value="Add"&gt;&lt;/div&gt;
          &lt;div style="clear:both;"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div style="clear:both;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>FURTHER INFORMATION</strong>:<br />
  This only happens when I fire the event, close the modal dialog then re-open it with a different <code>watchListID</code></p>
  
  <p>THE STRUCTURE OF DATA:</p>
  
  <ul>
  <li><strong>main.asp</strong>: LOADS > </li>
  <li><strong>modal.asp</strong>: modal.asp contains the jquery from above + two divs on this page with panel1.asp and panel2.asp data...</li>
  <li><strong>panel1.asp</strong>: Contains the HTML above...</li>
  <li><strong>panel2.asp</strong>: Contains nothing related... just pure HTML.</li>
  </ul>