unable to populate scoreboard grid from xml file

I am able to pull most of the xml data I need however when it comes to 3 different periods to populate a scoreboard Grid I am not able to pull the goals scorced in each period for this case I only coded the home team which is Calgary here.

Here is how I arrange the code

 if ($(Team).attr('vh') == "H") {

                        $('#imghome').attr('src', 'http://images.sportsnetwork.com/nhl/attherink/logos/'+$(Team).attr('ID')+".png");
					homescore = $(Team).find('Linescore').attr('Score');
					$('#hometeamscore').html(homescore);
                    homefirstp = $(Team).find('LineQuarter').attr('Prd');
					if (homefirstp == 1) { 
					homefirstps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH1').html(homefirstps);
					}
					 homesecondp = $(Team).find('LineQuarter').attr('Prd');
					if (homesecondp == 2) { 
					homesecondps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH2').html(homesecondps);
					}
					 homethirdp = $(Team).find('LineQuarter').attr('Prd');
					if (homethirdp == 3) { 
					homethirdps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH3').html(homethirdps);
					}

Open in new window

here is the entire webpage

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Sports Network</title>
<style type="text/css">
.TOPALIGN {
	text-align: center;
	vertical-align: top;
}
.sizescore {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 25px;
	font-style: normal;
	font-weight: bold;
	color: #000;
}
.cellcolor {
	color: #F5F4D6;
}
.cellcolor td {
	color: #F8F5AD;
}
.cellcolor td {
	color: #000;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//var myVar = setInterval(loadData, 1000);
var xmlPath ='.' //'/xml/nhl/scores/real';
var xmlGameID = '16937'; 
var awayscore, homescore, hometeamshots, awayteamshots,homefaceoffspct,awayfaceoffspctawayhits,homehits,homepenalties,awaypenalties,homefirstp,homefirstps,homesecondp,homesecondps,homethirdp,homethirdps;
$(document).ready(function(){
    $.ajax({
        type: "GET",
        url:  xmlPath+"/"+xmlGameID+ ".xml",
        dataType: "xml",
        success: function(data) {
            var d = $(data);
			var Play = d.find('Play');
			var period = Play.attr("Quarter");
            $(txtPeriod).html(period);
            var timeleft = Play.attr("TimeLeft")
            $(txtTime).html(timeleft);
            d.find('Team').each(function(i,Team){
                var team=$(Team);
				
                var id = team.attr("ID").toLowerCase();
                
                    if ($(Team).attr('vh') == "H") {

                        $('#imghome').attr('src', 'http://images.sportsnetwork.com/nhl/attherink/logos/'+$(Team).attr('ID')+".png");
					homescore = $(Team).find('Linescore').attr('Score');
					$('#hometeamscore').html(homescore);
                    homefirstp = $(Team).find('LineQuarter').attr('Prd');
					if (homefirstp == 1) { 
					homefirstps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH1').html(homefirstps);
					}
					 homesecondp = $(Team).find('LineQuarter').attr('Prd');
					if (homesecondp == 2) { 
					homesecondps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH2').html(homesecondps);
					}
					 homethirdp = $(Team).find('LineQuarter').attr('Prd');
					if (homethirdp == 3) { 
					homethirdps = $(Team).find('LineQuarter').attr('score');
					$('#peroidH3').html(homethirdps);
					}
					
					
					
					
					
					var Hometeam =$(Team).attr('Fullname');
					// $('#txtHometeam').html(Hometeam);
					 $('#txtHometeam').html(Hometeam);
					 var txtHome1 =$(Team).attr('name');
					// $('#txtHometeam').html(Hometeam);
					 $('#txtHome').html(txtHome1);
					hometeamshots = $(Team).find('TeamStats').attr('Shots');
					
					$('#homeShots').html(hometeamshots);
					homefaceoffspct = $(Team).find('TeamStats').attr('FaceOffsPct');
					
					$('#homeFO').html(homefaceoffspct + '%');
					homehits = $(Team).find('TeamStats').attr('Hits');
					
					$('#homeHits').html(homehits);
					homepenalties = $(Team).find('TeamStats').attr('Penalties');
					
					$('#homepenalties').html(homepenalties);
					
					
               }
				
                
                    if ($(Team).attr('vh') == "A") {

                        $('#imgaway').attr('src', 'http://images.sportsnetwork.com/nhl/attherink/logos/'+$(Team).attr('ID')+".png");
 					awayscore = $(Team).find('Linescore').attr('Score');
					$('#awayteamscore').html(awayscore);
                    
					// var VS1 = $(Team).find('Linescore');
					 var Awayteam =$(Team).attr('Fullname');
					 $('#txtAwayteam').html(Awayteam);
					 var txtAway1 =$(Team).attr('name');
					// $('#txtHometeam').html(Hometeam);
					 $('#txtAway').html(txtAway1);
					 awayteamshots = $(Team).find('TeamStats').attr('Shots');
					
					$('#awayShots').html(awayteamshots);
					awayfaceoffspct = $(Team).find('TeamStats').attr('FaceOffsPct');
					
					$('#awayFO').html(awayfaceoffspct + '%');
       				 awayhits = $(Team).find('TeamStats').attr('Hits');
					
					$('#awayHits').html(awayhits);
					awaypenalties = $(Team).find('TeamStats').attr('Penalties');
					
					$('#awayPenalties').html(awaypenalties);
                }
            });
        } 
    });
});


</script>
</head>

<body>
<table width="700" border="0">
  
    <td width="224"><table width="100%" border="0">
      <tr>
        <td width="36%" height="59"><img src="http://199.233.14.112/aspdata/nhl2/IMAGES/Defaultlogo.png" name="imgaway" width="75" height="75" id="imgaway"></td>
        <td width="43%"><p class="TOPALIGN" id="txtAwayteam">AwayTeam</p>
          <p>&nbsp;</p></td>
        <td width="21%"><p class="TOPALIGN sizescore"><strong id="awayteamscore">0</strong></p>
          </td>
      </tr>
    </table>
      <table width="100%" border="0">
        <tr>
          <td width="23%"><div align="center">Shots</div></td>
          <td width="35%"><div align="center">FaceOff %</div></td>
          <td width="16%"><div align="center">Hits</div></td>
          <td width="26%"><div align="center">Penalties</div></td>
        </tr>
        <tr class="cellcolor">
          <td><div align="center" id="awayShots"></div></td>
          <td><div align="center" id="awayFO"></div></td>
          <td><div align="center" id="awayHits"></div></td>
          <td><div align="center" id="awayPenalties"></div></td>
        </tr>
      </table></td>
    <td width="214" class="TOPALIGN"><table width="100%" border="0">
      <tr>
        <td><div align="center"><span class="TOPALIGN">Period</span></div></td>
        <td><div align="center"><span class="TOPALIGN">Time Remaining</span></div></td>
      </tr>
      <tr>
        <td id="txtPeriod"><div align="center" id="txtPeriod"></div></td>
        <td class="TOPALIGN"><div align="center" id="txtTime"></div></td>
      </tr>
    </table>
      <table width="100%" border="1">
        <tr>
          <td width="50%">&nbsp;</td>
          <td width="12%"><div align="center">1</div></td>
          <td width="14%"><div align="center">2</div></td>
          <td width="12%"><div align="center">3</div></td>
          <td width="12%" id="overtime"><div align="center">OT</div></td>
        </tr>
        <tr>
          <td><div align="center" id="txtAway">Visitor</div></td>
          <td><div align="center" id="period1V"></div></td>
          <td><div align="center" id="period2V"></div></td>
          <td><div align="center" id="periodV3"></div></td>
          <td><div align="center" id="periodv4"></div></td>
        </tr>
        <tr>
          <td><div align="center" id="txtHome">Home</div></td>
          <td><div align="center" id="periodH1"></div></td>
          <td><div align="center" id="peroidH2"></div></td>
          <td><div align="center" id="periodH3"></div></td>
          <td><div align="center" id="peroidH4"></div></td>
        </tr>
      </table></td>
    <td width="248" class="TOPALIGN"><table width="100%" border="0">
      <tr>
        <td width="35%"><img src="http://199.233.14.112/aspdata/nhl2/IMAGES/Defaultlogo.png" alt="" name="imghome" width="75" height="75" id="imghome"></td>
        <td width="35%" class="TOPALIGN" id="txtHometeam"><p>HomeTeam</p></td>
        <td width="30%"><p class="TOPALIGN"><strong class="TOPALIGN sizescore" id="hometeamscore">0</strong></p></td>
      </tr>
    </table>
      <table width="100%" border="0">
        <tr>
          <td width="28%"><div align="center">Shots</div></td>
          <td width="29%"><div align="center">FaceOff %</div></td>
          <td width="18%"><div align="center">Hits</div></td>
          <td width="25%"><div align="center">Penalties</div></td>
        </tr>
        <tr>
          <td><div align="center" id="homeShots"></div></td>
          <td><div align="center" id="homeFO"></div></td>
          <td><div align="center" id="homeHits"></div></td>
          <td><div align="center" id="homepenalties"></div></td>
        </tr>
      </table></td>
  </tr>
</table>
</body>
</html>

Open in new window

Attached is Html and xml game log in a zipped folder cause EE makes a_ into a - for xml files
hOCKEY.zip
powerztomAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
You need to loop through all the LineQuarter children to find the right one. The way you are doing it, the period always equals "1", never "2" or "3".
if ($(Team).attr('vh') == "H") {

                        $('#imghome').attr('src', 'http://images.sportsnetwork.com/nhl/attherink/logos/'+$(Team).attr('ID')+".png");
					$(Team).find('LineQuarter').each(function(){
						if($(this).attr('Prd') == "1") {
							$('#periodH1').text($(this).attr('score'));
						} else if ($(this).attr('Prd') == "2") {
							$('#periodH2').text($(this).attr('score'));
						} else {
							$('#periodH3').text($(this).attr('score'));
						}
					});

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
powerztomAuthor Commented:
Thanks Tommy Boy that's two days in a row. Thanks for explanation.
0
Tom BeckCommented:
Yep, I got all the required points for the entire month from you and it's only October 2nd! Thanks for being there.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.