如何渲染每行最多4个项目

<div class="container"></div>

.container {
  display: flex;
  flex-wrap: wrap;
}

.item {
  width: 25%; /* 每行最多显示4个项目，所以每个项目占25%的宽度 */
  /* 其他样式设置 */
}

const container = document.querySelector('.container');
const items = ['项目1', '项目2', '项目3', '项目4', '项目5', '项目6', '项目7', '项目8', '项目9', '项目10'];

let count = 0;
items.forEach(item => {
  const newItem = document.createElement('div');
  newItem.classList.add('item');
  newItem.textContent = item;
  container.appendChild(newItem);
  
  count++;
  if (count === 4) {
    const lineBreak = document.createElement('div');
    lineBreak.classList.add('line-break');
    container.appendChild(lineBreak);
    count = 0;
  }
});