Как добавить background в цикле?

Question

[reinmaker90]

Нужно для каждого el в цикле добавить цвет из массива. Где ошибка?

let div = document.querySelectorAll('div')
let e = [...div].map(el => {
    el.style.width = '200px';
    el.style.height = '50px';
    el.style.border = '1px solid gray'
    let colors = ['red','blue','yellow','green']
    for (const color of colors) {
        console.log(color)
        el.style.backgroundColor = color
    }
})

Answer 1

[Тигран Абрамян]

const div = document.querySelectorAll('div');
const colors = [ 'red','blue','yellow','green' ];

div.forEach((el, index) => {
  el.style.width = '200px';
  el.style.height = '50px';
  el.style.border = '1px solid gray'
  el.style.backgroundColor = colors[index];
});

Comments

[reinmaker90]

спасибо

[hzzzzl]

reinmaker90, если в массиве меньше цветов, чем на странице элементов, то чтобы цвета повторялись --

el.style.backgroundColor = colors[index % colors.length];

[reinmaker90]

hzzzzl, спасибо