JavaScript JavaScript and the DOM Getting a Handle on the DOM Using CSS Queries to Select Page Elements

Ivan Boric
Ivan Boric
23,315 Points
Posted by Ivan Boric
Ivan Boric
23,315 Points

Can't get text color to work

I'm using workspaces and Chrome Version 57.0.2987.98 (64-bit) 

const myList = document.getElementsByTagName('li');

for (let i = 0; i < myList.lenght; i += 1) {
  myList[i].style.color = 'purple';
}

const errorNotPurple = document.querySelectorAll('.error-not-purple');

for (let i = 0; i < errorNotPurple.lenght; i += 1) {
  errorNotPurple[i].style.color = 'red';
}

<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript and the DOM</title>
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body>
    <h1 id="myHeading">JavaScript and the DOM</h1>
    <p>Making a web page interactive</p>
<p>Things that are purple:</p>
<ul>
  <li>grapes</li>
  <li class="error-not-purple">oranges</li>
  <li>amethyst</li>
  <li>lavender</li>
  <li class="error-not-purple">fire trucks</li>
  <li class="error-not-purple">snow</li>
  <li>plums</li>
</ul>
    <script src="app.js"></script>
  </body>
</html>
Ivan Boric
Ivan Boric
23,315 Points
Ivan Boric
Ivan Boric
23,315 Points

Thx for the quick reply Alam...of course it had to be a typo :) works now, thanks!

1 Answer

ruhullalam
ruhullalam
14,500 Points

You've spelt length wrong twice

See if that fixes it?

i < errorNotPurple.lenght; i += 1) {