Javascript: comparsa di un quadrato verde trascinabile col mouse, che sparisce al rilascio.

Bene.
Iniziamo con il programma.

Ho bisogno di creare un elemento al click del mouse.
Disponiamo che al click sulla pagina si crei un DIV in una determinata posizione.
Ed ecco che ho creato il codice che fa apparire, al click del mouse, dei div quadrati verdi con l'angolo superiore sinistro corrispondente alla posizione del mouse:

function crea(e){
 var elemento=document.createElement("div");
 elemento.className="classe";
 elemento.style.left=e.clientX+"px";
 elemento.style.top=e.clientY+"px";
 document.body.appendChild(elemento);
}
document.onmousedown=crea;

Però adesso mi serve che l'elemento si distrugga quando lascio il mouse.
Proviamo...

Sono andato abbastanza avanti!
Ecco il codice che fa apparire un quadrato verde al click del mouse, lo trascina intorno liberamente e poi lo distrugge al rilascio del mouse:

<script>
var elemento;
function crea(e){
 elemento=document.createElement("div");
 elemento.setAttribute("id","nome");
 elemento.className="classe";
 elemento.style.left=e.clientX-50+"px";
 elemento.style.top=e.clientY-50+"px";
 document.body.appendChild(elemento);
}
function OnMouseMove(e){
 elemento.style.left=e.clientX-50+"px";
 elemento.style.top=e.clientY-50+"px";
}

function distruggi(e){
 var genitore=document.body;
 elemento=e.target;
 genitore.removeChild(elemento);
}
document.onmousedown=crea;
document.onmouseup=distruggi;
document.onmousemove=OnMouseMove;
</script> 

Va un po' perfezionato, forse...