JSFiddle - React, Tailwind, and code Playground

by Luke Marlow

HTML

<a href="" class="type type1">Weapons</a> | 
<a href="" class="type type2">Armour</a> | 
<a href="" class="type type3">Food</a>

<table class="table">
	<tr type="1">
		<th>Weapon</th>
	</tr>
	<tr type="2">
		<th>Armour</th>
	</tr>
	<tr type="3">
		<th>Food</th>
	</tr>
</table>

CSS

tr {
    display: none;
}

JavaScript

$(function() {
    $('.type').click(function(e) {
        e.preventDefault();
        $('tr').hide().filter('tr[type="' + $(this).attr('class').split(" ")[1].substr(4) + '"]').show();
    });
});