Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript DOM Scripting By Example Editing and Filtering Names Fix DOM Manipulation Code

Lucan Fraser
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Lucan Fraser
Full Stack JavaScript Techdegree Graduate 16,816 Points

DOM Script challenge

Why would this code not run. it appears to me to be the correct 'if()' condition!

app.js
const laws = document.getElementsByTagName('li');
const indexText = document.getElementById('boldIndex');
const button = document.getElementById('embolden');

button.addEventListener('click', (e) => {
    const index = parseInt(indexText.value, 10);

    for (let i = 0; i < laws.length; i += 1) {
       let law = laws[i];

       // replace 'false' with a correct test condition on the line below
       if (index === law) {

           law.style.fontWeight = 'bold';
       } else {
           law.style.fontWeight = 'normal';
       }
    }
});
index.html
<!DOCTYPE html>
<html>
<head>
  <title>Newton's Laws</title>
</head>
<body>
  <h1>Newton's Laws of Motion</h1>
  <ul>
    <li>An object in motion tends to stay in motion, unless acted on by an outside force.</li>
    <li>Acceleration is dependent on the forces acting upon an object and the mass of the object.</li>
    <li>For every action, there is an equal and opposite reaction.</li>
  </ul>
  <input type="text" id="boldIndex">
  <button id="embolden">Embolden</button>
  <script src="app.js"></script>
</body>
</html>

1 Answer

Antonio De Rose
Antonio De Rose
20,885 Points

nope this is wrong, how can it be correct.

Have you understood the question, I try re-phrase

Quite simple.

Compare the value which have had been put inside the textbox, which then is stored into a variable called index, which you have perfectly doing, but, with whom are you comparing.

question clearly states - "We want to be able to enter a 0, 1 or 2 in the text field to embolden the list item with the corresponding index"

const laws = document.getElementsByTagName('li');  // this returns an array, and it will have a count of 3, as there 3 li
// index is a integer, can you compare an integer with an array
// it will have to apples with apples, when it comes to comparson

// the main reason to loop, the laws, is to break down the individual value
// first time the loop will a value, second time another third time another

// that is storing in the variable 'i', array starts from 0
// what is assumed as entered in the textbox 0 or 1 or 2

// try it, let me know, if you stuck
Lucan Fraser
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Lucan Fraser
Full Stack JavaScript Techdegree Graduate 16,816 Points

I think I understand conceptually. I had to paste the code into my editor to see what was being returned. The item in the array was being compared to the input value....i.e ( 0 === <li>For every action, there is an equal and opposite reaction.</li>). Which was what you had stated, so i change it to ( index === i) thanks for the assistance.