DOM scripting by examples, challenge task 1of 1

Question

if statement

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 (indexText === 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>

Answer 1 · 2019-02-25T13:59:40Z

February 25, 2019 1:59pm

Hi Marcelo

You've got the right idea. In your condition, you're seeing if the indexText === laws[i], however, what you want to do is have a conditional that checks if the index value is equal to laws list number

In your condition: law is never equal to indexText, as this is what they both equal.

indexText = document.getElementById('boldIndex');
law = document.getElementsByTagName('li')[i];

What you need to do is get the value of law and the value of the indexText

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); // This is the value of indexText

    for (let i = 0; i < laws.length; i += 1) { // i is the value of the the iterable list item
       let law = laws[i];

       if ( index === i ) {
           law.style.fontWeight = ' bold';
       } else {
           law.style.fontWeight = 'normal';
       }
    }
});

Hope this makes sense

Good Luck

Answer 2 · 2019-02-25T17:26:50Z

February 25, 2019 5:26pm

thank you for you help .

Welcome to the Treehouse Community

Looking to learn something new?

Marcelo Pereira

Marcelo Pereira

DOM scripting by examples, challenge task 1of 1

2 Answers

Liam Clarke

Liam Clarke

Marcelo Pereira

Marcelo Pereira