How to use event.target when setting specific event handlers?

Question

I am not able to pass this quiz. The function is undefined. Can you take a look at my code>

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>JavaScript is an exciting language that you can use to power web servers, create desktop programs, and even control robots. But JavaScript got its start in the browser way back in 1995.</p>
            <hr>
            <p>Things to Learn</p>
            <ul>
                <li>Item One: <input type="text"></li>
                <li>Item Two: <input type="text"></li>
                <li>Item Three: <input type="text"></li>
                <li>Item Four: <input type="text"></li>
            </ul>
            <button>Save</button>
        </section>
        <script src="app.js"></script>
    </body>
</html>

app.js

let section = document.getElementsByTagName('section'[0]);

section.addEventListener('click', (e) => {
  if (e.target.tagName == 'INPUT'){
    e.target.style.backgroundColor = 'rgb(255, 255, 0)';
  }
});

Answer 1 · 2018-11-04T03:18:28Z

November 4, 2018 3:18am

Hi Nick,

The error is in the first line of app.js.

Instead of let section = document.getElementsByTagName('section'[0]),

try let section = document.getElementsByTagName('section')[0].

The getElementsByTagName function takes in the argument of a tagname, i.e. section.

if you enclose [0] within the brackets, the function cannot read the tag name and thus it is undefined.

After reading the correct tag name (section), it will then look for index 0, thus (section)[0] is the correct answer.

Hope this helps!

Welcome to the Treehouse Community

Looking to learn something new?

Nick Rocha

Nick Rocha

How to use event.target when setting specific event handlers?

Steven Parker

Steven Parker

Jinjia Lin

Jinjia Lin

1 Answer

Jinjia Lin

Jinjia Lin

Jennifer Nordell

Jennifer Nordell