Fetch data from xml file and display in html table using Ajax and xpath

Question

Here is how i started with

<script>
$(document).ready(function() {

    $.ajax({
        type : "GET",
        url : "EmployeeData.xml",
        dataType : "xml",
        success : processXml
    });
});

// function to process the read in XML
function processXml(xml) {
    var nodes = xmlDoc.selectNodes("/employeelist/employee");

          // Help Here
    }</script>

xml file

<employeelist>
<employee>
    <id>01</id>
    <name>Bob</name>
    <gender>M</gender>
    <designation>Traniee</designation>
    <salary>18000</salary>
    <doj>01-03-2012</doj>
</employee>
<employee>
    <id>02</id>
    <name>Rob</name>
    <gender>M</gender>
    <designation>Manager</designation>
    <salary>40000</salary>
    <doj>04-03-2010</doj>
</employee></employeelist>

I want to use xpath to traverse the xml file and get all the elements and child node values. Place where i stuck is , how to loop the node to get child node values.

thanks..!!

Answer 1

 xmlDoc = $.parseXML( xml ),
    $xml = $( xmlDoc ),
    $employee= $xml.find( "employee" );

reference parse xml

Answer 2

Here is the code i used

for ( var i = 0; i < nodes.length; i++) {
var id = nodes[i].selectSingleNode("id").firstChild.nodeValue;
var name = nodes[i].selectSingleNode("name").firstChild.nodeValue;
var designation = nodes[i].selectSingleNode("designation").firstChild.nodeValue;
}