JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <button id='startRoundBtn'>
    play!
  </button>
</div>
<div class='player-div'>
  Player 1 wins: <span class='score' id='w1'>0</span>
  <div>
    <img src='' alt='' id='c1' />
  </div>
</div>

<div class='player-div'>
  Player 2 wins <span class='score' id='w2'>0</span>
  <div>
    <img src='' alt='' id='c2' />
  </div>
</div>
<script>

</script>

CSS

.player-div {
  width: 150px;
  display: inline-block;
}

.score {
  font-weight: bold;
}

JavaScript

var cards = ["14", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12","13"]
var p1_wins = 0;
var p2_wins = 0;

function startRound() {
  var p1_card_index = Math.floor(Math.random() * 13);
  var p2_card_index = p1_card_index;
  while (p2_card_index == p1_card_index) {
    p2_card_index = Math.floor(Math.random() * 13);
  }

  document.getElementById('c1').src = cards[p1_card_index];
  document.getElementById('c1').alt = cards[p1_card_index];
  document.getElementById('c2').src = cards[p2_card_index];
  document.getElementById('c2').alt = cards[p2_card_index];

  if (p1_card_index > p2_card_index) {
    p1_wins++;
    document.getElementById('w1').innerHTML = p1_wins;
  } else {
    p2_wins++;
    document.getElementById('w2').innerHTML = p2_wins;
  }
}
document.addEventListener('DOMContentLoaded', function(){
  document.getElementById('startRoundBtn').addEventListener('click', startRound);
})