JSFiddle - React, Tailwind, and code Playground

HTML

_________________________Статистические показатели__________________________
________________________________________________________________________________

<table style="height: 5px; width: 668px;">
<tbody>
<tr>
<td>Общий доход: <span id="result"></span>%</td>
</tr>
<tr>
<td>Количество событий: <span id="vsego"></span></td>
</tr>
<tr>
<td>Выиграло: <span id="win"></span></td>
</tr>
<tr>
<td>Проиграло: <span id="lose"></span></td>
</tr>
<tr>
<td>Возвратов: <span id="vozvrat"></span></td>
</tr>
<tr>
<td>Средний коэффициент: <span id="sredkof"></span></td>
</tr>
<tr>
<td>Итог: <span id="dohod"></span> РУБ</td>
</tr>
</tbody>
</table>
_______________________________________________________________________________
_______________________________________________________________________________
___________________________Спортивные события___________________________________

<table style="width: 672px; height: 60px; font-family: arial; font-weight: bold;" align="center">
<tbody>
<tr style="height: 40px;">
<td style="width: 100px;">30.08.2016</td>
<td style="width: 90px; text-align: center;">Футбол</td>
<td style="width: 250px; text-align: center;">Египет - Гвинея</td>
<td style="width: 120px;">ТБ (2.5)</td>
<td class="calc" 35px="">1.85</td>
<td style="width: 40px; text-align: center;">-</td>
</tr>
</tbody>
</table>
<table style="width: 672px; height: 60px; font-family: arial; font-weight: bold;" align="center">
<tbody>
<tr style="height: 40px;">
<td style="width: 100px;">30.08.2016</td>
<td style="width: 90px; text-align: center;">Хоккей</td>
<td style="width: 250px; text-align: center;">СКА - Ак Барс</td>
<td style="width: 120px;">Фора 2 (1.5)</td>
<td class="calc" 35px="">1.70</td>
<td style="width: 40px; text-align: center;">+</td>
</tr>
</tbody>
</table>
<table style="width: 672px; height: 60px; font-family: arial; font-weight: bold;" align="center">
<tbody>
<tr style="height: 40px;">
<td style="width: 100px;">29.08.2016</td>
<td style="width: 90px; text-align:...

TypeScript

function myfunc() {                 
var calc = $$('td.calc');        
var summ = 0;        
var node;        
var sumcalc; 
var sumcalc = 0;                
for(var i =0; i < calc.length; i++){node = calc[i].getSiblings('td');        
sumcalc = sumcalc + Number(calc[i].innerHTML);                           
if(node[0].innerHTML == '+'){node[0].addClass('plus');           
summ = summ  + Number(calc[i].innerHTML)* 10 - 10;}                  
else if(node[0].innerHTML == '-') {node[0].addClass('minus');           
summ = summ - 10; }        
else if(node[0].innerHTML == '=') {node[0].addClass('ravno');}  
}       
document.getElementById('result').innerHTML = summ.toFixed(2);       
$('win').innerHTML=$$('.plus').length;       
$('lose').innerHTML=$$('.minus').length;       
$('vozvrat').innerHTML=$$('.ravno').length;       
$('vsego').innerHTML=$$('.plus').length + $$('.minus').length + $$('.ravno').length;       
var dohod = summ * 10 + 1000;
$('dohod').innerHTML = dohod.toFixed(2);       
var sredkof = sumcalc / calc.length;
$('sredkof').innerHTML =  sredkof.toFixed(2);
}
window.onload = myfunc;