As a general improvement I'd use ``` tilde, like so:
text = `<div
class="palette"
title="original"
style="background-color: ${colours[i]}"
>
${i}
</div>;`
What you're actually doing is resetting text every loop. So you only ever get the last item in the array; i=10 and colour = #007FFF, what you need to do is either loop through and .appendChild(node) OR text += <div></div> so that you have a long string that you then do .innerHTML = text with.
I suggest the first way, attaching divs as a string is not a good practise.
Gustavo Benedito Costa
Deaf-born, computer science student and language lover