jQuery AJAX: Content in XML document not shown in HTML document

I'm trying to get tag content of an XML document (KFZ.xml) into an ordered list in an HTML document but it doesn't work yet - can't figure out why.

Here's the XML document:


<?xml version="1.0" encoding="utf-8"?>
<LIST>
<KFZ>
    <Herst>Citroen</Herst>
    <Mod>DS3 Racing</Mod>
</KFZ>
<KFZ>
    <Herst>Peugeot</Herst>
    <Mod>206 RZ</Mod>
</KFZ>
<KFZ>
    <Herst>Mercedes Benz</Herst>
    <Mod>C63 AMG</Mod>
</KFZ>
<KFZ>
    <Herst>Mini Cooper</Herst>
    <Mod>John Cooper Works</Mod>
</KFZ>
</LIST>

This is what my HTML document looks like.


<!DOCTYPE html>
<html xmlns="http://ift.tt/lH0Osb">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST</title>
<script src="http://ift.tt/1mWWrGH"></script>
<script>
$(document).ready(function(){ 
    $("#KFZ").append("<ol></ol>");
    $.ajax({ 
    type:'GET',
    url:'KFZ.xml',
        dataType:'xml',
        success:function(xml){
            $(xml).find('KFZ').each(function(){
                var sHerst = $(this).find('Herst').text();
                var sMod = $(this).find('Mod').text();
                $('<li></li>').html(sHerst + ', ' + sMod).appendTo('#KFZ ol');
            });
        },
    });
});
</script>
</head>

<body>
<div id="KFZ"></div>
</body>
</html>

Can you guys see any mistake in the code? I'm running it local using Xampp to simulate the server...

jQuery AJAX: Content in XML document not shown in HTML document

No comments:

Post a Comment