[jQuery] Nested .each functions
i'm currently building an FAQ system using XML and jQuery. So far,
everything is has been great until now. I have an $.ajax request that
calls to an XML file that contains the questions and answers for a
particular topic. when you click your topic, it loads any tags with
the name "title" into a SPAN in an empty DIV. now i'd like to load all
the tags with the name "answer" into a SPAN below the "title" SPAN.
i'm using a .each function to loop through all the "title" tags, but
it's not working for the "answer" tags. i'd appreciate any help i can
get. thank you!
sample:
$('#cat2top1').click(function(){
$('#faq_content').empty();
$.ajax({
url: 'includes/data/paygo_cat2top1.xml',
type: 'GET',
dataType: 'xml',
error: function(){
alert('Error!');
},
success: function(xmlData){
$(xmlData).find('title').each(function(){
var qtxt = $(this).text();
$(xmlData).find('answer').each(function(){
var atxt = $(this).text();
$('<span class="question"></
span>').html(qtxt).fadeIn('fast').appendTo('#faq_content');
$('<span class="answer"></
span>').html(atxt).fadeIn('fast').appendTo('#faq_content').insertAfter('.question');
});
});
}
});
});