Desvinculación de funciones anónimas en JavaScript

Supongamos que ahora a nuestros párrafos está vinculada una función anónima:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function() {
		console.log(this.textContent);
	});
}

Supongamos que queremos desvincular esta función del párrafo después de hacer clic en este párrafo. Sin embargo, nos enfrentamos a un problema: la función no tiene nombre, lo que significa que no podremos referirnos a ella por ese nombre para desvincularla.

Para resolver el problema necesitamos darle un nombre a la función, convirtiéndola en una expresión funcional con nombre. Hagamos esto:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function func() { // le dimos nombre a la función
		console.log(this.textContent);
	});
}

Ahora esta función se puede desvincular dentro de ella misma:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function func() {
		console.log(this.textContent);
		this.removeEventListener('click', func); // desvinculamos la función
	});
}

Dada una lista ul, en cada elemento de la cual hay un número. Haz que al hacer clic en cualquier li su número aumente en uno.

Modifica la tarea anterior para que cada li aumente su valor solo en el primer clic sobre ella.

Modifica la tarea anterior para que cada li aumente su valor solo si su valor es menor a 10.