JSFiddle - React, Tailwind, and code Playground

by Kehlan Krumme

HTML

<table border=1>
<tbody id="entries"></tbody>
</table>

JavaScript

var tEntries = document.getElementById("entries");

var entrants = [
  {
    name: "Deadgamer",
    entries: 120
  },
  {
    name: "Elhorn",
    entries: 35
  },
  {
    name: "Holigemm",
    entries: 680
  },
  {
    name: "Kallua",
    entries: 40
  },
  {
    name: "Rikker",
    entries: 60
  }
];

var totalEntries = 0;

for	(var i = 0; i < entrants.length; i++) {
	totalEntries += entrants[i].entries;
  
  tEntries.innerHTML += "<tr id=" + entrants[i].name + "><td>" + entrants[i].name + "</td><td align=right>" + entrants[i].entries + "</td></tr>";
}

var roll = Math.random();

for	(var i = 0; i < entrants.length; i++) {
	entrants[i].chance = entrants[i].entries / totalEntries;
  
  if (i == 0) {
  	entrants[i].bound = entrants[i].chance;
  } else {
  	entrants[i].bound = entrants[i].chance + entrants[i - 1].bound;
  }
  
  var trEntrant = document.getElementById(entrants[i].name);
  
  trEntrant.innerHTML += "<td align=right>" + entrants[i].chance + "</td>";
  
  trEntrant.innerHTML += "<td align=right>" + entrants[i].bound + "</td>";  
}

for	(var i = 0; i < entrants.length; i++) {
	if (roll <= entrants[i].bound) {  
  	var trEntrant = document.getElementById(entrants[i].name);
    
  	trEntrant.innerHTML += "<td><strong>WINNER</strong></td>";
    
  	break;
  }
}

tEntries.innerHTML += "<tr><td><strong>TOTAL</strong></td><td align=right>" + totalEntries + "</td></tr>";

tEntries.innerHTML += "<tr><td><strong>ROLL</td><td>" + roll + "</td></tr>";