Anyone can help me do this test. It is too hard for me T_T. I think I don't quite understand the concept of it

Question

Anyone can help me do this task. It is too hard for me T_T. I think I don't quite understand the concept of it as the the lessons taught previously may use too much complex examples and too fast for me to catch up.

But I think that this task (that I can't do) should be a simple task that if i know the answer, it will make me more understand the concept.

Please help

Methee S.

app.js

var list = document.getElementsByTagName('ul')[0];

list.addEventListener('click', function(e) {
  if (e.target.tagName == 'BUTTON') {

  }
});

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>JavaScript and the DOM</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <section>
            <h1>Making a Webpage Interactive</h1>
            <p>Things to Learn</p>
            <ul>
                <li><p>Element Selection</p><button>Highlight</button></li>
                <li><p>Events</p><button>Highlight</button></li>
                <li><p>Event Listening</p><button>Highlight</button></li>
                <li><p>DOM Traversal</p><button>Highlight</button></li>
            </ul>
        </section>
        <script src="app.js"></script>
    </body>
</html>

Answer 1 · 2019-03-14T20:30:18Z

March 14, 2019 8:30pm

Ok, I just passed this one...Without pasting my code, my understanding is you are telling the program to highlight an item in the list when the corresponding button is pressed, by adding a className of "highlight" to the previousElementSibling of the button, which is the <p>. Make sure you use "className", not "class", or it won't work. Hope this helps!

Answer 2 · 2019-03-14T21:24:17Z

March 14, 2019 9:24pm

I'll tell you the answer in plain English, you'll have to translate it to code.

You'll want to select the buttons previous sibling (HINT: You'll need to actually select the button first... e.target.SELECT_SIBLING_SOMEHOW?)
Then you'll need to add a class to the buttons sibling (the <p>)
You'll need something in the css to actually apply the style. So if you add the class highlight you'll need .highlight in your css with a background-color?

Welcome to the Treehouse Community

Looking to learn something new?

Methee Saengow

Methee Saengow

Anyone can help me do this test. It is too hard for me T_T. I think I don't quite understand the concept of it

2 Answers

Luci Peterson

Luci Peterson

tomd

tomd