Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Query Selector Methods</title> </head> <body> <div id="news"> <h1 class="headline">Headline 1</h1> <h1 class="headline">Headline 2</h1> <h1 class="headline">Headline 3</h1> </div> <script> const headlines = document.querySelectorAll('.headline'); // Highlight all headlines headlines.forEach(headline => { headline.style.color = 'red'; }); // Display the number of headlines document.body.insertAdjacentHTML('beforeend', `<p>Number of headlines: ${headlines.length}</p>`); </script> </body> </html>