XML List Items

XML List Items

I'm having a little trouble following this tutorial and wondered if anyone can help?

http://think2loud.com/using-jquery-and-xml-to-populate-a-drop-down-box/

Basically, he's creating drop down lists, but each item (even though its a subset) is organized on the same tree level of the tree.

<option> Parent
<option> Child 1
<option> Child 2
...

instead of

<optgroup> Parent
      <option> Child 1
      <option> Child 2
</optgroup>

....

I'm trying to do something similar with <ul><li> elements, but the problem that I'm having is that I can't get the child elements to attach to the correct parent element.

  1.       var modelList = $("#modelList");
  2.            
  3.             $(xml).find("series").each(function(){
  4.                
  5.                 var series = $(this).attr("name");
  6.                     $("#modelList").append("<ul>"+series+"</ul>");
  7.                    
  8.                     $(this).find("model").each(function(){
  9.                         var modelName = $(this).attr("name");
  10.                         $("#modelList > ul").parent().append("<li>"+modelName+"</li>");
  11.                     });
  12.                 });
When it displays, all of the child elements attach to each of the parents.