[jQuery] Parsing XML and appending to an array?
I'm new to jQuery and what I am trying to do is take the XML response
below and obtain the src attribute from each image. I then want to
append that value to an array which can be used later. Now my issue is
when it gets to
Code:
$('response', returnedXMLResponse).each(function(){ ... }
it only iterates to the first row in the XML document and gives me
001.jpg when I output tmpImageSrc to console. It won't cycle through
the rest of the image tags as the alert only appears once with a value
of 0. What am I missing? Am I not using the proper .each? How can I
build my array from the XML response?
XML:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<response>
<image src="001.jpg" />
<image src="003.jpg" />
<image src="004.jpg" />
<image src="002.jpg" />
<image src="005.jpg" />
<image src="006.jpg" />
</response>
jQuery:
<script type="text/javascript">
var imageList = [];
var i = 0;
$(document).ready(function(){
// Get data and parse it into an array
$.ajax({
url: 'xmlResponse.xml',
type: 'GET',
dataType: 'xml',
success: function(returnedXMLResponse){
console.log(returnedXMLResponse);
$('response', returnedXMLResponse).each(function()
{
var tmpImageSrc = $(this).find("image").attr
("src");
console.log(tmpImageSrc);
imageList.push(tmpImageSrc);
alert(i);
i++;
})
} // End Success
}); // End AJAX
//console.log(imageList);
});
</script>