window.onload=function(){
	importXML();
}

function importXML() {
	
	var xmlhttp =  new XMLHttpRequest();
	xmlhttp.open("GET", "properties.xml", false);
	xmlhttp.onreadystatechange = function() {
	    if (xmlhttp.readyState == 4) {
	        // Your callback code goes here
	    }
	}
	// if needed set header information 
	// using the setRequestHeader method
	xmlhttp.send(null);

	var xmlDoc = xmlhttp.responseXML;
	var productNames = xmlDoc.getElementsByTagName("name");
	var productDescs = xmlDoc.getElementsByTagName("desc");
	
	var locations = document.getElementById('locations').getElementsByTagName('area');
	
	for (var i = 0; i < locations.length; i++)
	{
		locations[i].productName = "<h1>" + productNames[i].firstChild.nodeValue + "</h1";
		locations[i].productDesc = productDescs[i].firstChild.nodeValue
		locations[i].onclick = function(){getlocationInfo(this.productName, this.productDesc);};
	}
}

function getlocationInfo(productName, productDesc)
{
	//document.getElementById('ID OF CONTAINER HERE').innerHTML = productName;
	document.getElementById('locationInfo').innerHTML = productDesc;
}