I am trying to add a series of links to a div and then an a click
event to the links. If I append outside of the the .each() iteration
the link is matched by the click event handler.  However, links
created  within the loop are not matched by the click event handler.
My code is :

$("#col1").append("<a href='6'>link</a><br/>");  // links added in
this way are matched ok

$.ajax({ type: "GET", url:"/catalog/category_all/", dataType: "xml",
                success: function(xml) {
                   // format and output result
                   $(xml).find('object').each(function(){
                                $("#col1").append("<a href='" + 
$(this).attr('pk')+ "'>"+ $
(this).find('field').text() + "</a><br/>");          // links added in
this way do not match

                   });
                 }
         });

$("#col1 a").click(function(){
                         var href = $(this).attr('href');
                         alert(href);
                         $.ajax({ type: "GET", url:"/catalog/category_sub/" + 
href ,
dataType: "xml", success: function(xml2) {
                                        $(xml2).find('object').each(function(){
                                                $("#col2").append("<a href='" + 
$(this).attr('pk')+ ">"+ $
(this).find('field').text() + "</a><br/>");
                                         });    //close each
                                }
                         });
                         // stop normal link click
                         return false;
        });

Can anybody suggest what I might be doing wrong?

Reply via email to