ContextQMD
Back to Freecodecamp

Step 7

curriculum/challenges/english/blocks/workshop-html-music-player/698c55e7aaacfae48a227459.md

latest1.3 KB
Original Source

--description--

Add a new h2 element below the audio element with the text Cruising for a Musing.

Below the h2, add a p element with the text Artist: Quincy Larson.

--hints--

You should have a second h2 element.

js
assert.exists(document.querySelector('h2:nth-of-type(2)'));

Your second h2 element should contain the text Cruising for a Musing.

js
const h2 = document.querySelector('h2:nth-of-type(2)');
assert.strictEqual(h2?.textContent.trim(), 'Cruising for a Musing');

You should have a second p element.

js
assert.exists(document.querySelector('p:nth-of-type(2)'));

Your second p element should contain the text Artist: Quincy Larson.

js
const p = document.querySelector('p:nth-of-type(2)');
assert.strictEqual(p?.textContent.trim(), 'Artist: Quincy Larson');

--seed--

--seed-contents--

html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Working with the HTML Audio Element</title>
</head>
<body>
  <h1>freeCodeCamp Tunes</h1>

  <h2>Can't Stay Down</h2>
  <p>Artist: Quincy Larson</p>
  
  <audio src="https://cdn.freecodecamp.org/curriculum/js-music-player/can't-stay-down.mp3" loop controls></audio>
  
--fcc-editable-region--
  
--fcc-editable-region--

</body>
</html>