title: How to hook a click event to a dynamically created anchor tag using jQuery
body: <p>Inside a jQuery loop, I'm trying to attach a click event to a dynamically created anchor tag which is contained in an LI element. The LI itself is dynamically created inside a static UL element. For some reason nothing gets fired when the anchor is clicked. Here is a simplified version of the problematic code:</p>
  
  <pre><code>$.each($.MyProject.cities, function (index, city) {
      $('&lt;li&gt;&lt;/li&gt;').html($("&lt;a&gt;&lt;/a&gt;").attr("href", "javascript:void(0)").click(function (event) {
          console.info("Anchor clicked!");
          event.preventDefault();
          return false;
      }).html($("&lt;span&gt;&lt;/span&gt;").text(city.FullName).attr("class", "autoText"))).appendTo($("#visiblecities"));
  });
  </code></pre>
  
  <p>where visiblecities is the id of the UL element and cities is a collection on which the loop iterates.</p>
  
  <p>Any idea why the click event is not working?</p>