title: preventDefault not working on anchor
body: <p>I'm trying to log the click on an anchor that's being generated asynchronously. </p>
  
  <p>The asynchronous call - which works perfectly fine - looks like this: </p>
  
  <pre><code> $("#txt_search").keyup(function() {
      var search = $("#txt_search").val();
  
      if (search.length &gt; 0)
      {
        $.ajax({
          type: "post",
          url: "&lt;?php echo site_url ('members/searchmember') ;?&gt;",
          data:'search=' + search,
        success: function(msg){
          $('#search_results').html("");
          var obj = JSON.parse(msg);
  
          if (obj.length &gt; 0)
          {
            try
            {
              var items=[];   
              $.each(obj, function(i,val){                      
                  items.push($('&lt;li class="search_result" /&gt;').html(
                    '&lt;img src="&lt;?php echo base_url(); ?&gt;' + val.userImage + ' " /&gt;&lt;a class="user_name" href="" rel="' + val.userId + '"&gt;'
                    + val.userFirstName + ' ' + val.userLastName 
                    + ' (' + val.userEmail + ')&lt;/a&gt;'
                    )
                  );
              }); 
              $('#search_results').append.apply($('#search_results'), items);
            } 
            catch(e) 
            {   
              alert(e);
            }   
          }
          else
          {
            $('#search_results').html($('&lt;li/&gt;').text('This user does not have an account yet'));   
          }   
  
        },
        error: function(){            
          alert('The connection is lost');
        }
        });
      }
    });
  </code></pre>
  
  <p>The anchor I want to get to is <code>&lt;a class="user_name" href="" rel="' + val.userId + '"&gt;' + val.userFirstName + ' ' + val.userLastName + ' (' + val.userEmail + ')&lt;/a&gt;'</code></p>
  
  <p>I detect the click on these anchors with this function:</p>
  
  <pre><code>  // click op search results
    $("a.user_name").on('click', function(e) {
      e.preventDefault(); 
    });
  </code></pre>
  
  <p>The problem seems to be that the <code>preventDefault</code> is not doing anything... I've looked at most of the questions involving this problem on Stackoverflow and checked jQuery's own documentation on the topic, but I can't seem to find what's wrong. I've tried adding a <code>async: false</code> statement to the AJAX-call, because perhaps the asynchronous call might be the problem, but that didn't fix it. </p>