JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
</head>
<body>
<table>
<tr>
<td>
<a class="toggle" href="#">Toggle</a>
<a class="toggle" href="#">Toggle1</a>
</td>
</tr>
<tr style="display:none">
<td>
<span>hello</span>
<img class="cancel" alt="cancel" src="/static/images/cancel.png" />
</td>
<tr style="display:none">
<td>
<span>hello222</span>
<img class="cancel" alt="cancel" src="/static/images/cancel.png" />
</td>
</tr>
</tr>
<tr>
</tr>
<tr style="display:none">
<td>
<span>hello2223</span>
<img class="cancel" alt="cancel" src="/static/images/cancel.png" />
</td>
</tr>
</table>
</body>
</html>
JavaScript
$(document).ready(function() {
$(".toggle").click(function(){
$(this).parents("tr:first").next().toggle();
});
$(".cancel").click(function(){
$(this).parents("tr:second").prev().toggle();
});
});