JSFiddle - React, Tailwind, and code Playground

HTML

<body id="Home">
<header id="stats">
    <ul class="firstul">
        <li id="username"></li>
        <li id="lvl"></li>
        <li id="exp"></li>
    </ul>
    <ul>
        <li id="expNeeded"></li>
        <li id="nextLevel"></li>
        <li id="hp"></li>
    </ul>
    <ul>
        <li id="attack"></li>
        <li id="defense"></li>
        <li id="speed"></li>
    </ul>
    <ul>
        <li id="gold"></li>
        <li id="items">Items: </li>
    </ul>
</header>
<header id="nav">
    <h1 id="user"></h1>
    <ul>
        <a href="index.html"><li class="first">Home</li></a>
        <a href="battle.html"><li>Battle</li></a>
        <a href="#"><li>Profile</li></a>
        <a href="#"><li>Inventory</li></a>
        <a href="#"><li>Help</li></a>
    </ul>
</header>
<main>

    <h2 id="intro">Welcome to the Village of Esteria traveler. Our village is plagued by a curse and attacked relentlessly by hordes of monsters led by the evil dragon Sahaan. Will you help us lift this curse and free ourselves from these terrible monsters?</h2>
	<h1 id="newsh1"></h1>
	<ul id="news"></ul>
    <button id="help">Yes</button>
    <button id="noHelp">No</button>
    
</main>
</body>

JavaScript

function Player(username, lvl, exp, expNeeded, nextLevel, gold, hp, atk, def, spd) {
    var self = this;
    this.username = username;
    this.lvl = lvl;
    this.exp = exp;
    this.nextLevel = nextLevel;
    this.expNeeded = expNeeded;
    this.gold = gold;
    this.fullLife = hp;
    this.hp = hp;
    this.atk = atk;
    this.def = def;
    this.spd = spd;
}

if($('body').attr("id") == "Home") {
    var newPlayer = new Player(prompt("What is your username?"), 1, 0, 10, 10, 0, 10, 2, 1, 1);
    localStorage.setItem("player", JSON.stringify(newPlayer));
    
     $('#user').text(newPlayer.username).addClass('playerName').data('player', self);
    $('#username').text("Username: " + newPlayer.username);
    $('#lvl').text("Level: " + newPlayer.lvl);
    $('#exp').text("Experience: " + newPlayer.exp);
    $('#expNeeded').text("Experience Needed: " + newPlayer.expNeeded);
    $('#gold').text("Gold: " + newPlayer.gold);
    $('#hp').text("HP: " + newPlayer.fullLife);
    $('#attack').text("Attack: " + newPlayer.atk);
    $('#defense').text("Defense: " + newPlayer.def);
    $('#speed').text("Speed: " + newPlayer.spd);
    $('#nextLevel').text("Next Level: " + newPlayer.nextLevel);
}

playerEl = $('.playerName');
player = playerEl.data('player');