I have successfully got my Phonegap + Jquery Mobile app pulling and reading data from a xml page on my server.

It lists the product photos but I want to be able to have a popup for each image with more information however I just cannot get it to work ... can anyone tell me why this bit won't work? For some reason it lists each image AND the content in the divpop .... simply won't work ...

2.       category = 'Cases';
3.       $.ajax({
4.             type: "GET",
5.              url: "http://www.myurl.com.au/accessories.xml",
6.              dataType: "xml",
7.              beforeSend : function() {$.mobile.loading('show')},
8.              complete : function() {$.mobile.loading('hide')},
9.              success: parseXml
10.       });
11. 
    
12.       function parseXml(xml) {
13.             $(xml).find('item').each(function(){
14.                   if ($(this).find('category').text().indexOf(category) != -1) {
15.                   
16.                   $("#datacase").append('<a href="#' + $(this).find("id").text() + '" data-rel="popup" data-transition="pop"><img src="' + $(this).find("image").text() + '" style="-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;float:left;margin:1px;height:auto" width="49%"></a><div data-role="popup" id="' + $(this).find("id").text() + '">Popup for this case</div>');
17.                   }
18.             });