Back to Freecodecamp

Step 3

curriculum/challenges/english/blocks/workshop-tailwind-pricing-component/686386e76197458b7dfd52ec.md

latest1.1 KB
Original Source

--description--

Under the h2, create a p element with the text $0. Then, inside that p element and after the text, create a span element with the text /month.

--hints--

You should create a p element with the text $0.

js
const p = document.querySelector("p");
const pTextBeforeSpan = p.childNodes[0].textContent.trim();

assert.equal(pTextBeforeSpan, "$0");

You should create a span element with the text /month inside the p element.

js
const spanText = document.querySelector("p > span")?.textContent;
assert.equal(spanText, "/month");

--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>Music App Pricing</title>
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body>
    <main>
      <h1>Choose your listening plan</h1>
      <div>
        <div>
          <div>
            <h2>Listener</h2>
            --fcc-editable-region--
            
            --fcc-editable-region--
          </div>
        </div>
      </div>
    </main>
  </body>
</html>