Turning this XML into JSON Jquery

Question

So I have this XML from Winamp

<dict>
        <key>Track ID</key><integer>0</integer>
        <key>Name</key><string>American Idol 2013</string>
        <key>Artist</key><string>Amber Holcomb</string>
        <key>Album Artist</key><string>Amber Holcomb</string>
        <key>Album</key><string>Unknown Album</string>
        <key>Kind</key><string>MPEG audio file</string>
        <key>Size</key><integer>3645</integer>
        <key>Total Time</key><integer>233000</integer>
        <key>Date Modified</key><date>Thu Mar 14 12:11:12 2013</date>
        <key>Date Added</key><date>Thu Apr 04 16:10:15 2013</date>
        <key>Bitrate</key><integer>128</integer>
        <key>Location</key><string>file://localhost/Z:%5Canthony%5CMusic%5CiTunes%5CiTunes%20Media%5CMusic%5CUnknown%20Artist%5CUnknown%20Album%5CAmber%20Holcomb%20-%20A%20Moment%20Like%20This%20-%20Studio%20Version%20-%20American%20Idol%202013.mp3</string>
        <key>File Folder Count</key><integer>-1</integer>
        <key>Library Folder Count</key><integer>-1</integer>
      </dict>

I want to turn it into a JsonArray

var myarray = {"TrackID":0, "Name":"American IDol 2013"...};

I found out how to loop through each tag, but I'm can't seem to wrap my head how to do this. I was thinking of creating a predefined Json array or something {"TrackID": "", "Name":""}, and when the JSON is complete, I push it into the master JSON (so sorry if I'm not explaining this correctly).

Is there a way to make a single array of all keys and another with the rest, and then merge them into a JSON array? I could really use some advice please.

Thank you all for your help.

Answer 1

I just answered my own question I think...

var key1 = "keyname";
var val1 = "value";

var myarray = {};

myarray[key1] = val1;

---

So here's the xml: http://honciano.com/kayokee/ci/uploads/xmlbackup2.xml

This is the code I used to create my Json Array. I don't know if this is the proper way of doing it, but I got it to work. The problem I was having was getting the value from the "KEY" tag and get the value after the "KEY" tag, but the tags that are not "KEY" is either "STRING" or "INTEGER".

So this is what I created....

$.ajax({
                url: "<? echo base_url().'uploads/songlist.xml';?>",
                dataType: 'HTML',

                success: function(data){
                    var myarray ={"track":[]};
                    var key1 = "";
                    var val1 = "";          
                    var arrayContainer = {};
                    var myCount = 0;
                    $(data).find("dict").children("dict").children("dict").each(function(){



                        $(this).children().each(function(i, e){
                            var nodeKey=(this).nodeName;

                            if(nodeKey=="KEY"){
                                key1 = $(this).text();

                            } else {
                                val1 = $(this).text();
                                arrayContainer[key1] = val1;
                                myCount++;
                                //console.log("key1:"+key1+" - val1:"+val1+" - myCount:"+myCount);
                            }               

                            if(myCount==14){
                                myarray.track.push(arrayContainer);
                                arrayContainer={};
                                myCount=0;
                                //console.log("cutoff new line");
                            }           
                        });


                    });

                    $.each(myarray.track, function(i, obj){
                        $.each(obj, function(e, val){
                            console.log("e:"+e+" - val:"+val);
                        });
                    });


                }
            })

It totally works and its giving me exactly what I want. Thanks all!