Simple filtering of XML records using Javascript

Hi everyone.

Ive successfully loaded XML data in a HTML page using Javasrcipt only (sourced from Mark Wilton-Jones’s howtocreate.co.uk tutorial).

Here’s the XML:

[CODE]<Feat_Artist>
<Artist id=”1″>
<Genre>Rock</Genre>
<Photo>Band_1.jpg</Photo>
<Name>Band 1</Name>
<Descrip>Band 1 descrip</Descrip>
</Artist>
<Artist id=”2″>
<Genre>Folk</Genre>
<Photo>Band_2.jpg</Photo>
<Name>Band 2</Name>
<Descrip>Band 2 descrip</Descrip>
</Artist>
<Artist id=”3″>
<Genre>Country</Genre>
<Photo>Band_3.jpg</Photo>
<Name>Band 3</Name>
<Descrip>Band 3 descrip</Descrip>
</Artist>
</Feat_Artist>[/CODE]

Here’s the script:

[CODE]<script language=”JavaScript”>

function printArtists(xmlDoc) {

var x = xmlDoc.getElementsByTagName(“Artist”);
var writtenString = ”;
var placetooutput = document.getElementById(‘writeroot’);

for(var i=0; i < x.length; i++) {
writtenString += ‘<table width=”100%” border=”0″>’;
writtenString += ‘<tr>’;
writtenString += ‘<td colspan=”2″>’ + x[i].getElementsByTagName(“Genre”)[0].childNodes[0].nodeValue + ‘<hr>’ + ‘</td>’;
writtenString += ‘</tr>’
writtenString += ‘<tr>’;
writtenString += ‘<td width=”20%” rowspan=”2″>’ + ‘<img src=”‘ + x[i].getElementsByTagName(“Photo”)[0].childNodes[0].nodeValue + ‘” width=”160″>’ + ‘</td>’;
writtenString += ‘<td width=”80%”>’ + x[i].getElementsByTagName(“Name”)[0].childNodes[0].nodeValue + ‘</td>’;
writtenString += ‘</tr>’;
writtenString += ‘<tr>’;
writtenString += ‘<td>’ + x[i].getElementsByTagName(“Descrip”)[0].childNodes[0].nodeValue + ‘</td>’;
writtenString += ‘</tr>’;
writtenString += ‘</table>’;
}

placetooutput.innerHTML = writtenString;
}
</script>[/CODE]

Ok so my question…..
I’d like to filter the records to show specific child (<Artist>) elements.
Say i wanted to only display <Artist id=”1″> in the table. What scripting would i need to add/modify to do this?

Much thanks for any help!

Also in #JavaScript _↴