JSFiddle - React, Tailwind, and code Playground
HTML
<div id="players">
<div class="score">Player 1 : <span id="player1">0</span> </div>
<div class="score" style="float: right;">Player 2 : <span id="player2">0</span> </div>
</div>
<input id="check" type="submit" value="check" />
CSS
#players
{display:block;
margin:50px 10px;}
.score
{display: inline-block;}
#check
{display: block;
margin: 10px;}
JavaScript
var score = [0,0];
var localCorrect = 2;
$(document).ready(function(){
//create a player object
function player(name,state,score) {
this.name = name;
this.state = state;
this.score = score;
}
var players = [
new player('player1',true,0),
new player('player2',false,0)
];
$("#check").click(function(){
if(localCorrect == 2){
//counting number of correct cards and assigning it to the player
var i=0;
if (players[i].state == true){
var localscore = players[i].score;
localscore++;
score[i] = localscore;
//display the score
$("span#"+players[i].name).html(score[i]);
players[i].state = false;
i++;
players[i].state = true;
//if(i=2)
//{i=0}
}
}else{
//some other thing
}
});
});