There is an anchor with the class of "hide-btn1" that I want to trigger a series of actions when clicked:
- The rcol-content should hide and the text should change from Hide to Show
- The #container width needs to increase to 2038px
- The table.status-table width must be increased to 1669px
I've written this code snippet so far, but I'm not sure how to proceed:
$('.hide-btn1').on('click', function(e) {
e.preventDefault();
$(this).text(function(i,v) {
return v === 'Show' ? 'Hide' : 'Show';
});
});
Note: I have also included the requested HTML Code below:
<div id="container">
<a class="hide-btn1">Hide</a>
<div class="rcol-content">
<p>This would be included in the right column</p>
</div>
<table class="status-table>
<tr>
<th>Heading</th>
</tr>
<tr>
<td>Table Data</td>
</tr>
</table>
</div><!-- end container -->