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;
    this.implement = function() {
        $('#user').text(this.username).addClass('playerName').data('player', self);
        $('#username').text("Username: " + this.username);
        $('#lvl').text("Level: " + this.lvl);
        $('#exp').text("Experience: " + this.exp);
        $('#expNeeded').text("Experience Needed: " + this.expNeeded);
        $('#gold').text("Gold: " + this.gold);
        $('#hp').text("HP: " + this.fullLife);
        $('#attack').text("Attack: " + this.atk);
        $('#defense').text("Defense: " + this.def);
        $('#speed').text("Speed: " + this.spd);
        $('#nextLevel').text("Next Level: " + this.nextLevel);
    };
    this.implement();
}
if($('body').attr("id") == "Home") {
    var newPlayer = new Player(prompt("What is your username?"), 1, 0, 10, 10, 0, 10, 2, 1, 1);
}
playerEl = $('.playerName');
player = playerEl.data('player');