JSFiddle - React, Tailwind, and code Playground

HTML

<section class="group summer">
		<article class="weeklyStandings">
            <h2>Week 1</h2>
			<table id="mytable">
                <tbody>
				<tr>
					<th>Player</th>
					<th>Won</th>
					<th>Played</th>
					<th>Winning %</th>
				</tr>
				<tr class="record">
					<td>Player 1</td>
					<td>8</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 2</td>
					<td>8</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 3</td>
					<td>7</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 4</td>
					<td>6</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 5</td>
					<td>6</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 6</td>
					<td>6</td>
					<td>12</td>
					<td></td>
				</tr>
				<tr class="record">
					<td>Player 7</td>
					<td>6</td>
					<td>12</td>
					<td></td>
				</tr>
                </tbody>
			</table>
		</article>
	</section>
<div id="output"></div>
<button id="btn" type="button">Get Length</button>

CSS

body { 
    font-size: 13px; 
    font-family: "Lucida Grande","Lucida Sans Unicode", Arial, Verdana, sans-serif; 
    line-height: 20px; 
}
section {
    margin: 0 auto;
    padding: 20px 40px;
    width: 950px;
    border-left: 1px solid #999; 
    border-right: 1px solid #999; 
}
a {
    text-decoration: none;
}
a:hover {
    font-color: red;
}
h2 {
    padding: 5px;
    font-size: 16px;
}
.group:after {
    content:"";
    display: table;
    clear: both;
}
.winner {
    color: red;
}
.hidden {
    display: none;
}
.fleft {
    float: left;
}
.fright {
    float: right;
}
table {
    width: 300px;
}
article {
    float: left;
    margin-right: 22px;
}
table th {
    font-weight: bold;
}
table th, table td {
    padding: 5px 5px;
}
table td:nth-child(2), table td:nth-child(3), table td:nth-child(4) {
    text-align: center;
}
table tr:nth-child(2n) {
    background: #eee;
}
tr.sub {
    background: #666;
    color: #fff;
}
table.player {
    border: 1px solid #eee;
}

JavaScript

$(document).ready(function(){
    function getLength(){
        var length = $('#mytable tbody tr').length;
        return length;
    }
    $('#btn').click(function(){
           $('#mytable tbody').find('tr:first').remove();
            var lengthAfter = getLength();
            $('#output').html(lengthAfter);
     });    
});