Parsing XML

Parsing XML

Hi all, I have a question regarding parsing my XML file. Here is the task at hand, I have created my css and html to properly display a tournament bracket.  Also, there is an XML file that contains all game information regarding, teams, winners and losers, as well as the game number.  At different spots in my HTML i have different games.  Here is a sample of my XML :

  2. <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
  3. <tournament xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
  4. <game id="1">
  5. <home>USA</home>
  6. <away>Texas</away>
  7. <winner>USA</winner>
  8. <loser>Texas</loser>
  9. </game>
  10. <game id="2">
  11. <home>Jamaica</home>
  12. <away>Beermuda</away>
  13. <winner>Beermuda</winner>
  14. <loser>Jamaica</loser>
  15. </game>
  16. <game id="3">
  17. <home>Rockaway</home>
  18. <away>Mexico</away>
  19. <winner>Winner Game 3</winner>
  20. <loser>Loser Game 3</loser>
  21. </game>
  22. <game id="4">
  23. <home>Argentina</home>
  24. <away>Cuba</away>
  25. <winner>Winner Game 4</winner>
  26. <loser>Loser Game 4</loser>
  27. </tournament>

here is my issue.  I need to be able to reference each distinct game and it's information at different points as teams traverse (win/lose) the bracket.  Here is my current code  http://jsfiddle.net/jVQLE/
As you can see I can only pass the first match, and if I include the second match in the XML, all the data is display in my Match wrapper.  
Any help what-so-ever is greatly appreciated.  I want to be able to reference a certain game in my HTML doing something like
  2. <div class="matchR1-wrapL">
  3.     <game id='1'></game> 
  4. </div>
and this displays game 1, and then do it again with id='2', and have that display game 2 information.  Am I on the right track or is this the wrong direction?  Thank you so much in advance!!!