Amigo... tente alterar o seu HTML para o SEGUINTE:
<html>
<head>
<style>
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
th,
td {
padding: 5px;
}
</style>
</head>
<body>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script>
$(document).ready(function(){
$.ajax({
url: 'contactos.xml',
dataType: 'xml',
// Caso tenha encontrato o arquivo, leio os dados do xml
success: function(xml){
// Pegando todos os dados dentro da variavel array do arquivo xml
$(xml).find('CATALOG').each(function() {
var arrayCd = []; // Variavel para armazenar array de palavras e descricao
// Pegando todos os dados dentro da variavel option do arquivo xml
$(this).find('CD').each(function(){
//Mostrando na tela
content = "<table width='200'>";
content += "<tr><td>Title: </td><td>"+ $(this).find('TITLE').text() +"</td></tr>";
content += "<tr><td>Country: </td><td>"+ $(this).find('COUNTRY').text() +"</td></tr>";
content += "<tr><td>Company: </td><td>"+ $(this).find('COMPANY').text() +"</td></tr>";
content += "<tr><td>Price: </td><td>"+ $(this).find('PRICE').text() +"</td></tr>";
content += "<tr><td>Year: </td><td>"+ $(this).find('YEAR').text() +"</td></tr>";
content += "<tr><td>Artist: </td><td>"+ $(this).find('ARTIST').text() +"</td></tr>";
content += "</table><br />";
$("#content").append(content);
// Armazenando um array com indice word, description dentro do array arrayCd
// Voce pode utilizar esse array para enviar a outra pagina se quiser.
arrayCd.push(
[
{ 'TITLE' : $(this).find('TITLE').text(),
'COUNTRY' : $(this).find('COUNTRY').text(),
'COMPANY' : $(this).find('COMPANY').text(),
'PRICE' : $(this).find('PRICE').text(),
'YEAR' : $(this).find('YEAR').text(),
'ARTIST' : $(this).find('ARTIST').text() }
]
);
});
// Exibindo dados armazenado no array
console.log( arrayCd );
});
},
// Se nao consegui ler o arquivo xml, exibo mensagem de erro no console
error: function () {
console.log("Ocorreu um erro inesperado durante o processamento.");
}
});
});
</script>
<div id="content"></div>
</body>
</html>