I'm running into an issue with dynamically created divs. Here's how they are created:
// Loop through and append divs to #result_main_search
$("#result_main_search").append('<div class="singleresult_main_search">
<a href="http://somesite.com/" class="linktosight">'
+ SightsList[i]+ '</a> – ' +
'<img src="/images/balloon.gif" rel="'+ i
+'" class="balloon_img_main_search" /></div>');
After the loop, I need to set the href attribute for each link in the divs:
$('.singleresult_main_search').each(function() {
$.get("_ajax_get_sight_link.php", {'id':$("img", this).attr('rel')},
function(data) {
alert($(this).find('.linktosight').length);
$(this).find('a').attr('href', data);
alert(data);
});
})
The _ajax_get_sight_data.php file returns the link based on the id provided (alert(data) works fine). However, the alert that checks for the number of .linktosight elements always returns 0. I've tried .size() and $(this).find('a') without success. How can I fix this issue?