Query Selector by Class

Use querySelector() to select the first element with class "highlight" and change its text content to "Highlighted Text".

Platform-Provided HTML (READ-ONLY):
<div id="content">
  <p class="highlight">First paragraph</p>
  <p class="highlight">Second paragraph</p>
</div>

Steps:
1. Use document.querySelector() with a class selector (".highlight")
2. Change the selected element's textContent to "Highlighted Text"
3. Note: querySelector() only selects the FIRST matching element

Expected Output:

<div id="content">↵
  <p class="highlight">Highlighted Text</p>↵
  <p class="highlight">Second paragraph</p>↵
</div>

= newline. No newline after the last line.

Hints2 available

Topics:

HTML DOM

Code Editor

Tab to indent (Esc then Tab to move on) · Ctrl+Enter to run · Shift+Alt+F to format · Ctrl+Space to expand shortcuts (clog, fn, fori)

Your Output

Run your code to see the output here...

Test Cases

Run your code to see test case results.