title: Add the css ::before in a loop through list elements
body: <p>I have an unordered list that I want to emulate the following css but in javascript;</p>
  <pre><code>ul li:nth-child(6n+1) a:before { background: #81ecec; } 
  ul li:nth-child(6n+2) a:before { background: #ff7675; } 
  ......
  </code></pre>
  <p>I'm trying the following script,</p>
  <pre><code>const listItems = ul.getElementsByTagName('li');
      
      // Loop through the NodeList object.
      for (let i = 0; i &lt;= listItems.length - 1; i++) {
        listItems[i].setAttribute('data-text', listItems[i].innerText);
        randomColour = setBg();
        listItems[i].innerHTML.before('background:#' + randomColour);
        listItems[i].color.innerHTML = &quot;#&quot; + randomColour;
      }
  </code></pre>
  <p>but I get an error that listItems[i].innerHTML.before is not a function.</p>