Agregar y quitar contenido (texto) de un LABEL/DIV en otro con botón

[MajitoARG]

Hola, estoy empezando con esto del JS y no sé cómo resolver este ejercicio.
La idea es la siguiente: tengo una lista de productos con un botón de "agregar" cada uno. Al pulsar el botón se copia el contenido del LABEL (nombre del producto y el input cantidad) en un TEXTAREA.

Pregunta:
1) ¿Cómo agregar varios productos? sólo puedo poner uno solo.
2) ¿Cómo eliminar de la lista los que no quiera porque me arrepentí de agregarlos?
Esto es lo que tengo hasta ahora:

HTML:
<form>
<label id="producto">Producto 1 (cod.001) <input type="number" id="cant"></label>
<br>
<input type="button" value="Agregar" onclick="agregar();">
<br>

<label id="producto">Producto 2 (cod.002) <input type="number" id="cant"></label>
<br>
<input type="button" value="Agregar" onclick="agregar();">
<br>

<label id="producto">Producto 3 (cod.003) <input type="number" id="cant"></label>
<br>
<input type="button" value="Agregar" onclick="agregar();">
<br>

(Varios productos más ...)

<textarea id="caja" rows="5" style="width:300px;"></textarea>
</form>

JS:
function agregar() {
document.getElementById("caja").value = document.getElementById("producto").textContent + document.getElementById("cant").value;

}

Espero se haya entendido y que alguien me ayude =)