[jQuery] Help with XML parsing/looping

[linesandwaves]

Hi all,

I realize this is a gigantic newbie question, but I am totally stuck
and I want to do this the right way... figured I'd go to the experts.

I'm trying to write a section of code in jquery that will read my XML
sheet and then produce a set of unordered lists with individual list
items in HTML.  I have it working, but the problem is that my code is
finding every single instance of certain tags and then adding them to
my lists.  So ultimately, every list that this code generates is
perfectly formatted, but they all have the same information.. which is
a problem.

Here is my XML sheet:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<breakfast>
        <dishset>
                <setname>The Royal Breakfast</setname>
                <entreelisting>
                        <entreename>Eggs and whatever</entreename>
                        <price>$15.00</price>
                </entreelisting>
                <entreelisting>
                        <entreename>A waffle with sprinkles on it</entreename>
                        <price>$15.00</price>
                </entreelisting>
                <entreelisting>
                        <entreename>Syrup-covered bacon bits</entreename>
                        <price>$15.00</price>
                </entreelisting>
        </dishset>
        <dishset>
                <setname>The Gravy Train</setname>
                <entreelisting>
                        <entreename>Gravy Boats</entreename>
                        <price>$15.00</price>
                </entreelisting>
                <entreelisting>
                        <entreename>Mush Plate</entreename>
                        <price>$15.00</price>
                </entreelisting>
                <entreelisting>
                        <entreename type="dishaddition">Deep Fried 
Anything</entreename>
                        <price>$15.00</price>
                </entreelisting>
        </dishset>
</breakfast>


And here is my jquery code:

// Start function when DOM has completely loaded
$(document).ready(function(){

        // Open the breakfast.xml file
        $.get("breakfast.xml",{},function(xml){

                // Build an HTML string
                myHTMLOutput = '';

                // Run the function for each dishset tag in the XML file
                $('dishset',xml).each(function(j){
                myHTMLOutput += '<ul class="dishsection">';
                setName = $(this).find("setname").text();
                if ((setName) != undefined){
                                myHTMLOutput += '<h3>'+ setName +'</h3>';
                }

                // Run the function for each entreelisting tag in the XML file
                $('entreelisting',xml).each(function(i) {
                        entreeName = $(this).find("entreename").text();
                        price = $(this).find("price").text();
                        dishAdditions = $(this).find("entreename").attr("type");
                        // Build row HTML data and store in string
                        mydata = BuildMenuHTML(entreeName,price,dishAdditions);
                        myHTMLOutput = myHTMLOutput + mydata;
                });  //run entreelist
                        myHTMLOutput += '</ul>';
                }); //run dishset function
                $("#menucontent").append(myHTMLOutput);
        }); //get xml file
});  //document.ready function



 function BuildMenuHTML(entreeName,price,dishAdditions){

        // Check to see if their is a "post" attribute in the name field
        if ((dishAdditions) != undefined){
                dishAdditionsHTML = '<span class="entreename">'+ dishAdditions 
+'</
em>';
                entreeNameHTML = '';
                liClassHTML = '<li class="dishsubentry">';
        }
        else
        {
                entreeNameHTML = '<span class="entreename">'+ entreeName 
+'</span>';
                dishAdditionsHTML = '';
                liClassHTML = '<li class="dishentry">';
        }

        // Build HTML string and return
        output = '';
        output += liClassHTML;
        output += entreeNameHTML;
        output += dishAdditionsHTML;
        output += '<span class="price">'+ price +'</span>';
        output += '</li>';
        return output;
}


I know that this is probably an obvious or easy fix related to calling
"each()" in the "entreelisting" function, but I just don't know what
the proper ways to reference certain things are.  Any chance anyone
out there could help??

Thanks!