title: JQuery - Add onclick to dynamically generated img tag
body: <p>I am creating several image dynamically using the following code:</p>
  
  <pre><code>function refresh_gallery(galleryidentifier, albumid) {
      $.ajax({ type: "POST", url: "/Photos/Thumbnails/" + albumid + "/", data: {}, success: function(msg) {
          try {
              var fotos = eval(msg); $(galleryidentifier).empty(); if (fotos.length == 0) { $(galleryidentifier).html("Press &amp;quot;Add files...&amp;quot; and select files to upload!"); return true; }
              for (var f in fotos) {
                  //this image needs the onclick eventhandler
                  $(document.createElement("img")).attr({ src: '/images/delete.gif', title: 'Delete ' + fotos[f].Title }).addClass("icon_delete").appendTo(galleryidentifier); ;
                  $(document.createElement("img")).attr({ src: fotos[f].ThumbnailPath, title: fotos[f].Title }).addClass("thumbnail").appendTo(galleryidentifier);
              }
              var del_div = $(document.createElement("div")).css({ "padding": "4px" }).appendTo(galleryidentifier);
              var delete_span = $(document.createElement("span")).click(delete_files(albumid)).css({ "cursor": "pointer", "font-size": "12px" }).appendTo(del_div);
              $(document.createElement("img")).attr({ "src": "/Content/images/delete.png" }).appendTo(delete_span);
              $(document.createTextNode("delete all")).appendTo(delete_span);
              return true;
          }
          catch (e) {
              alert(e);
          }
          alert("Refresh error!");
      }, error: function() { alert("Refresh error!"); }
      });
  }
  </code></pre>
  
  <p>The generation of the images is working fine, but I want to add an onclick eventhandler to the first image being generated (see comment in code).
  How do I do this? I'm fairly new to JQuery.</p>
  
  <p>Thanks!</p>