Element activation in JavaScript

Suppose we have some HTML table #table with empty cells.

Let's make it so that when you click on any cell, it is somehow activated, for example, it gets a red background. To do this, we will add some CSS class to activated cells:

.active {
	background: red;
}

Let's implement activation:

let tds = document.querySelectorAll('#table td');

for (let td of tds) {
	td.addEventListener('click', function() {
		this.classList.add('active');
	});
}

Given an HTML list ul. Make it so that when you click on any item in the list, it is activated with a red background.

Modify the previous task so that by clicking on the activated list item, activation is removed from it.