我尝试创建一个动态 HTML 页面，其中数据将来自对 AJAX 请求的 JSON 响应。我试图将三列排成一行，但我得到一列一排。

我想知道我的代码有什么问题。我很感激有人能给我一些指点。

window.onload = function loadDoc() {
  var url = "SK_movie_world_movies.json";
  
  $.getJSON(url,function(data) {
    $.each(data,function(i,item) {
      //alert(item.Title);
      let name = item.Title;
      let ca_st = item.cast;
      let dir = item.director;
      let gen = item.genre;
      let dur = item.duration;
      let lang = item.language;
      let syn = item.synopsis;
      let pic = item.image;
      let id = item.MoveID;

      $(".movie_container").append(
        `<div class="col-md-4 mb-5">
          <div class="card">
            <div class="text-center"><img src="${pic}" alt="${id}" class="card-img-top"></div>
            <div class="card-body">
              <h5 class="card-title text-center">${name}</h5>
              <p class="card-text">Cast: ${ca_st}</p>
              <p class="card-text">Director: ${dir}</p>
              <p class="card-text">Genre: ${gen}</p>
              <p class="card-text">Duration: ${dur}</p>
              <p class="card-text">Language: ${lang}</p>
              <div class="text-center">
                <a href="#" class="btn btn-primary">View Detail</a>
              </div>
            </div>
          </div>
        </div>`);
    });
  })
}