Having a little trouble

Question

Not exactly if i'm doing this write due to the wording of the question.

app.js

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

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

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 class = "highlight">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-10-20T14:00:52Z

October 20, 2019 2:00pm

Here's a few hints:

the paragraph is the sibling of the button, not the list
the line above just identified the button as "e.target"
you also still need to set the "class" attribute of the paragraph to "highlight"

Welcome to the Treehouse Community

Looking to learn something new?

Nikita Savelev

Nikita Savelev

Having a little trouble

1 Answer

Steven Parker

Steven Parker