Row hidder

HTML

<table>
<tr id="row1">
  <td>1.1</td>
  <td>1.2</td>
</tr>
<tr id="row2">
  <td>2.1</td>
  <td>2.2</td>
</tr>
</table>
<a href="#" id="row-hidder">Hide Row #1</a>

CSS

table {
  border-collapse: collapse;
}

td {
  border: 1px solid;
}

JavaScript

'use strict';
document.querySelector('#row-hidder').addEventListener('click', function(){
	let row = document.querySelector('#row1');
  if (row.style.display == 'none') {
  	row.style.display = '';
  } else {
    	row.style.display = 'none';
  }
});