// Start function when DOM has completely loaded 
$(document).ready(function(){ 
	// Open the xml file
	$.get("http://www.pokerstars.net/poker/promotions/americas-cup/data/datafile.xml",{},function(xml){
		// Build an HTML string
		HTMLOutput = '';
		//set up the table headings	
		$('country',xml).each(function(i) {
			countryname = $(this).find("countryname").text();
			countrynamelo = (countryname.toLowerCase()).replace(/^\s*|\s*$/g,''); //lowercase nospaces country name
			HTMLOutput += '<a name="' + countrynamelo + '" id="' + countrynamelo + '"></a><h3>' + countryname + '</h3>';
			HTMLOutput += ' <table class="online_events" width="100%"><tr><th>&#80;&#111;&#115;&#105;&#231;&#227;&#111;</th><th>Jogador</th><th>Pontos</th></tr>';
			
				// Run the function for each tag in the XML file
				$(this).children('rowdata').each(function(i) {
					position = $(this).find("position").text();
					player = $(this).find("player").text();
					points = $(this).find("points").text();
					
					// Build row HTML data and store in string
					mydata = buildHTML(position, player, points);
					HTMLOutput = HTMLOutput + mydata;
				});
		HTMLOutput += '</table>';
		});
		// Update the DIV called Content Area with the HTML string
		$("#writeRoot").append(HTMLOutput);
	});
});

function buildHTML(position, player, points){
	// Build HTML string and return
	output = '';
	output += '<tr>';
	output += '<td>'+ position + '</td>';
	output += '<td>'+ player +'</td>';
	output += '<td>'+ points +'</td>';
	output += '</tr>';
	return output;
}