Php 如何将jquery数据相应地/单独地填充到卡中？

我是Laravel框架的新手，我正在尝试使用引导卡开发一个简单的汽车列表网站。我已经成功实现了AJAX Get，包括使用Jquery append（）方法从控制器填充数据。但是，它在一张

卡中显示所有车辆。如何填充包含每辆车的每张卡


制作：
型号：
价格：RM

AJAX
$（文档）.ready（函数（）{
$（'#testbtn'）。单击（函数（）{
$.ajax({
键入：“GET”，
url:“/ajax/getCar”，
成功：功能（数据）{
$。每个（数据、功能（i、汽车）{
$（'.car_Make'）。追加（car.Make）；
$（'.car_Model'）。追加（car.Model+'
'）；
$（'.car_Year'）。追加（car.Year+'
）；
});
}
});
});
});
这就是你的意思

我创建了一个示例，其中使用了console.log数据中的一些行

说明：
我正在遍历数据数组。如果是第一次迭代，我将添加数据（代码中存在一个
CarDetail
div）

在下一次迭代中，我将克隆
CarDetail
div并填充下一个数据

当然，还有更多的方法可以将数据添加到页面中。例如，您可以填充页面中的第一项，然后从第二项迭代到最后一项（在这种情况下，您不需要if/else条件）或者你可以在JS变量中添加HTML代码，我个人不会这么做，因为它看起来很难看，代码的可读性可能会变得更差


$（文档）.ready（函数（）{
风险值数据=[
{id:31，品牌：“奥迪”，型号：“R8”，年份：2000}，
{id:32，品牌：“法拉利”，型号：“FF”，年份：2000}，
{id:33，品牌：“马自达”，型号：“Rx-7”，年份：2000}，
{id:34，品牌：“法拉利”，型号：“F12”，年份：2012}，
{id:35，品牌：“保时捷”，车型：“911”，年份：2015}，
{id:36，品牌：“路虎”，车型：“时尚”，年份：2015}，
{id:37，品牌：“梅赛德斯-奔驰”，型号：“SL350”，年份：2013}，
{id:38，品牌：“法拉利”，型号：“F12”，年份：2013}，
{id:39，品牌：“法拉利”，型号：“458”，年份：2013}，
];
$。每个（数据、功能（i、汽车）{
如果（i==0）{
$（'.card'）.find（'.car_Make'）.text（car.Make）；
$（'.card'）.find（'.car_Model'）.text（car.Model）；
$（'.card'）。查找（'.car_Year'）。文本（car.Year）；
}否则{
var cardeTailClone=$（'.card'）.first（）.clone（）；
carDetailCloned.find（'.car_Make'）.text（car.Make）；
carDetailCloned.find（'.car_Model'）.text（car.Model）；
carDetailCloned.find（'.car_Year'）.text（car.Year）；
$（'.card container'）.append（carDetailCloned）；
}
});
})；
.CarDetail{背景色：红色；页边距底部：2em}

制作：

型号：

价格：RM

AJAX
@mgarcia但是他使用了
append
函数，应该将数据附加到元素中。@Marcus你是否尝试过
控制台。记录你的数据并检查结果如何？@ValentinEmilCudelcu，你是对的（我删除了我以前的评论以避免引起混淆）！即便如此，他只有一个HTML元素用于插入汽车信息。如果他想为每辆汽车创建一张卡片，他必须为每张卡片重新创建HTML。@mgarcia谢谢你的回复。是的，数据是json格式的汽车对象。我想填充从ajax获取的数据，这些HTML元素位于@yes I have try
console.log
和之上de>append
效果很好。问题是我不知道如何将数据显示到卡片中，比如可以将ajax成功回调中获得的数据添加到问题中？另外，代码中每辆车的HTML是什么（从哪个节点到哪个节点）？其他汽车的HTML应该附加到哪里？是的，这是结果是want！但它仍然显示在一张
卡中，因为
CarDetail
是卡体。如何将它们填充到单独的卡中？@MarcusChan所以你希望每张卡都是
。并且每辆车都有一个数据。我说得对吗？@M如果答案对您有帮助，请将其标记为结束问题的最佳答案。谢谢！
public function GetCars(Request $request)
    {
        if ($request->ajax())
        {
            $cars = Car::all();

            return response()->json( $cars );
        }
 }

   <div class="album py-1">
        <div class="container bg-light">
            <div class="row py-2">
                    <div class="col-md-3">
                        <div class="card mb-3 shadow-sm">
                            <div class="hover-container">
                                        <img src="" class="image img-thumbnail">
                                        <a class="Viewbtn text-decoration-none" href="#" style="font-size: small">View</a>
                            </div>
                            <div class="card-body CarDetail">
                                <p class="card-text font-weight-bold">Make:<span class="car_Make"></span></p>
                                <p class="card-text font-weight-bold">Model:<span class="car_Model"></span></p>
                                <div class="d-flex justify-content-between align-items-center">
                                    <p class="font-italic table_data">Price: RM <span class="car_Year"></span></p>
                                </div>
                            </div>

                        </div>
                    </div>
            </div>
        </div>
    <button id="testbtn" type="submit" class="btn btn-success">AJAX</button>
    </div>


    <script>
        $(document).ready(function(){
            $('#testbtn').click(function () {
              $.ajax({
                  type: 'GET',
                  url: '/ajax/getCar',
                  success : function (data) {
                      $.each(data, function( i, car ) {
                          $('.car_Make').append(car.make);
                          $('.car_Model').append(car.model+'<br>');
                          $('.car_Year').append(car.year+'<br>');
                      });
                  }
              });
        });
        });
    </script>