JSFiddle - React, Tailwind, and code Playground
HTML
<div id="playerNames" class="playerInfo">
<form name="form1" method="post" id="newGame">
<p id="userInput">
<label>Player 1 name: </label>
<br />
<input type="text" name="p1" id="nameOne" value="" required />
<br />
<label>Player 2 name: </label>
<br />
<input type="text" name="p2" id="nameTwo" required />
<input id="submit" type="submit" value="New Game" />
</p>
</form>
</div>
<p id="pTurns"></p>
<p id="pScores"></p>
JavaScript
$(document).ready(function() {
$("#newGame").submit(function(e) {
e.preventDefault();
var player_One = $('#nameOne').val();
var player_Two = $('#nameTwo').val();
$('#pTurns').html(player_One + ", its your turn");
$('#pScores').html(player_One + ": 50pts </br>" + player_Two + ": 50pts </br>");
});
});