Jquery 将XML数据注入HTML表

我目前正在尝试将一个XML文件注入到我的HTML中，然后在表中显示它。我将在下面展示XML的一小部分：

<?xml version="1.0" encoding="UTF-8"?>
<product top-level-category="DSLR" sub-level-category="Camera Bundles">
    <id>0001</id>
    <title>NIKON D3300 DSLR Camera with 18-55 mm f/3.5-5.6 II ED Zoom Lens – BlacK</title>
    <brand>Nikon</brand>
    <price>279.00</price>
    <description>The Nikon D3300 DSLR Camera with 18-55 mm f/3.5-5.6 II ED Zoom Lens allows you to capture special moments in glorious high quality. Unforgettable memories, unforgettable photos. Small and lightweight, the D3300 has a 24.2 megapixel, 23.5 x 15.6 mm CMOS sensor with remarkable light sensitivity that produces amazingly sharp images. It performs well in low light with an ISO range of 100 to 12800 (extendable to 25600). Your images will be packed with fine textures and natural colours to really capture the atmosphere of whichever situation you find yourself in. Capture clear, colourful photographs in all manner of lighting conditions as the camera's EXPEED 4 image processor goes to work, delivering gorgeous photos every time.</description>
</product>

0001
尼康D3300单反相机，配备18-55毫米f/3.5-5.6 II ED变焦镜头-黑色
尼康
279
尼康D3300单反相机配备18-55毫米f/3.5-5.6 II ED变焦镜头，让您以出色的高质量捕捉特殊时刻。难忘的回忆，难忘的照片。D3300小巧轻便，拥有2420万像素、23.5 x 15.6毫米CMOS传感器，具有卓越的光灵敏度，可产生惊人的清晰图像。它在弱光下表现良好，ISO范围为100至12800（可扩展至25600）。你的图像将充满精细的纹理和自然的颜色，以真正捕捉你所处的任何环境的气氛。在相机的EXPEED 4图像处理器开始工作时，在各种照明条件下拍摄清晰、多彩的照片，每次都能拍摄出绚丽的照片。

考虑到标签ID、title、brand、price和description，我开始尝试编写一段jQuery（如下所示）来尝试将其链接到表中，但由于它不起作用，我陷入了停顿

$(document).ready(function() {
  $.ajax({
    type: "GET",
    url: "productsXmlStructure.xml",
    dataType: "xml",
    success: function(xml){
      $('#t01').append('<th>ID</th>'); 
      $('#t01').append('<table id="show_table">'); 
      $(xml).find('show').each(function(){
        var $show = $(this);
        var id = $show.find('ID').text();
        var title = $show.find('Title').text();
        var brand = $show.find('Brand').text();
        var price = $show.find('Price').text();
        var desc = $show.find('Description').text();
      });
    }
  });
});

$（文档）.ready（函数（）{
$.ajax({
键入：“获取”，
url:“productsXmlStructure.xml”，
数据类型：“xml”，
成功：函数（xml）{
$（'#t01'）。追加（'ID'）；
$（'#t01'）。附加（''）；
$（xml）.find（'show'）.each（function（）{
var$show=$（此）；
var id=$show.find（'id'）.text（）；
var title=$show.find（'title'）.text（）；
var brand=$show.find（'brand'）.text（）；
var price=$show.find（'price'）.text（）；
var desc=$show.find（'Description'）.text（）；
});
}
});
});

我对这门语言没有太多的知识，但是我的表格在下面。我不完全确定我在这里哪里出了问题，所以任何帮助都将不胜感激

<table id="t01" table border="2" style="width:75%" table align="center">
  <tr>
    <th>ID</th>
    <th>Title</th>
    <th>Brand</th>
    <th>Price</th>
    <th>Description</th>
  </tr>
</table>

身份证件
标题
烙印
价格
描述

使用

filter

而不是

find

产品

而不是

显示

（根据XML）

对于每个

产品

将行追加到

#t01

对于每个属性，将单元格与数据一起附加到上面的行

var xml='0001尼康D3300数码单反相机配备18-55毫米f/3.5-5.6 II ED变焦镜头–黑色尼康279.00配备18-55毫米f/3.5-5.6 II ED变焦镜头的尼康D3300数码单反相机可让您以出色的高质量捕捉特殊时刻。难忘的回忆，难忘的照片。D3300小巧轻便，拥有2420万像素、23.5 x 15.6毫米CMOS传感器，具有卓越的光灵敏度，可产生惊人的清晰图像。它在弱光下表现良好，ISO范围为100至12800（可扩展至25600）。你的图像将充满精细的纹理和自然的颜色，以真正捕捉你所处的任何环境的气氛。在相机耗资巨大的4位图像处理器工作时，在各种照明条件下拍摄清晰、多彩的照片，每次都能拍摄出绚丽的照片。”；
$（xml）.filter（'product'）.each（function（）{
var$show=$（此）；
风险值数据={
id:$show.find（'id'）.text（），
标题：$show.find（'title'）.text（），
品牌：$show.find（'brand'）.text（），
价格：$show.find（'price'）.text（），
desc:$show.find（'Description'）.text（）
};
变量行=$（''）；
用于（数据中的var prop）{
$（''+数据[prop]+''）。附加到（行）；
}
$（'#t01'）。追加（行）；
});

身份证件
标题
烙印
价格
描述
$（'#t01'）。追加（'ID'）$（“#t01”）。附加（”）没有意义。HTML中任何地方的表元素都不能是th元素的同级元素。我将尝试将其应用到我的代码中，并让您知道！不过看起来不错，谢谢！