Learn Basic JavaScript by Building a Role Playing Game - Step 17

Tell us what’s happening:

Describe your issue in detail here.
I have added the bold element, but it is still not working.

Your code so far

RPG - Dragon Repeller
XP: 0 Health: 100 Gold: 50

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

Challenge Information:

Learn Basic JavaScript by Building a Role Playing Game - Step 17

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.

Here is my code again:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="./styles.css">
    <title>RPG - Dragon Repeller</title>
    <script src="./script.js"></script>
  </head>
  <body>
    <div id="game">
      <div id="stats">
        <span class="stat">XP: <span><b> 0 </b> </span></span>
        <span class="stat">Health: <span><b> 100 </b> </span></span>
        <span class="stat">Gold: <span><b> 50 </b> </span></span>
      </div>
      <div id="controls"></div>
      <div id="monsterStats"></div>
      <div id="text"></div>
    </div>
  </body>
</html>

Hi!

Remember that the interface can be pretty particular. You’ve used b instead of strong, and you’ve nested inside the span elements instead of around them. I would suggest resetting this lesson and starting again with a clean slate, and making sure you’re following each direction in order.

2 Likes

Welcome to the forum

Please reset the step to restore the original code.

You used b elements instead of strong elements, also they were not nested correctly.

First nest the number in a span element.
Then nest that span element in a strong element.

Remember to add the id attribute to the correct element.

Happy coding

1 Like

Something like this?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="./styles.css">
    <title>RPG - Dragon Repeller</title>
    <script src="./script.js"></script>
  </head>
  <body>
    <div id="game">
      <div id="stats">
        <strong>
        <span id="xpText" class="stat">XP: <span>0</span></span>
        <span id="healthText" class="stat">Health: <span>100</span></span>
        <span id="goldText" class="stat">Gold: <span>50</span></span>
        </strong>
      </div>
      <div id="controls"></div>
      <div id="monsterStats"></div>
      <div id="text"></div>
    </div>
  </body>
</html>

The strong goes around each span element.
Then add the id attribute to each span element.

1 Like

Thank you! It worked!

2 Likes

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.