JSFiddle - React, Tailwind, and code Playground
HTML
<a href="#" class="Masterbutton">Show All</a>
<a href="#" style="display:hidden" id="Masterbutton2">Hide All</a>
<div>
<table width="300" border="0" cellspacing="0" cellpadding="0">
<tr class='address1'>
<td>disha</td>
<td>123</td>
</tr>
<tr class='address'>
<td>address</td>
<td>andheri</td>
<tr class='address1'>
<td>omkar</td>
<td>345</td>
</tr>
<tr class='address'>
<td>address</td>
<td>powai</td>
</tr>
</table>
</div>
CSS
div{margin-bottom:10px; border:1px solid green}
.Show{
width:100px;
height:60px;
float:left;
}
.Hide{
width:100px;
height:60px;
float:right;
}
JavaScript
$(function(){
$('table').each(function(){
// $('tr:first', this) .click(function(){
// $(this).siblings().toggle()
//});
$('.address', this).hide()
$('.address1', this).show()
});
$('a').click(function(){
$('table').each(function(){
$('tr:first', this).siblings().toggle()
});
var text=$('a').html();
});
});