如何将每条推文分别放入不同的bootstrap卡片

<div id="card-container"></div>

var tweets = [
  {
    text: "This is the first tweet",
    author: "John Doe",
    date: "2022-01-01"
  },
  {
    text: "Another tweet here",
    author: "Jane Smith",
    date: "2022-01-02"
  },
  // Add more tweets as needed
];

var cardContainer = document.getElementById("card-container");

for (var i = 0; i < tweets.length; i++) {
  var tweet = tweets[i];

  // 创建卡片元素
  var card = document.createElement("div");
  card.classList.add("card"); // 添加 Bootstrap 的卡片样式

  // 填充卡片内容
  var cardBody = document.createElement("div");
  cardBody.classList.add("card-body"); // 添加 Bootstrap 的卡片主体样式

  var tweetText = document.createElement("p");
  tweetText.classList.add("card-text"); // 添加 Bootstrap 的卡片文本样式
  tweetText.textContent = tweet.text;

  var tweetAuthor = document.createElement("p");
  tweetAuthor.classList.add("card-text"); // 添加 Bootstrap 的卡片文本样式
  tweetAuthor.textContent = "Author: " + tweet.author;

  var tweetDate = document.createElement("p");
  tweetDate.classList.add("card-text"); // 添加 Bootstrap 的卡片文本样式
  tweetDate.textContent = "Date: " + tweet.date;

  cardBody.appendChild(tweetText);
  cardBody.appendChild(tweetAuthor);
  cardBody.appendChild(tweetDate);

  card.appendChild(cardBody);

  cardContainer.appendChild(card);
}