Three js destroy renderer

Question

What's the best way to destroy a three js instance?
I'm finding that when I remove the canvas and re-add, my first renderer remains and I have two.

Currently I'm

1. Removing all the event listeners
2. cancelling requestAnimationFrame
3. deleting the renderer instance from it's parent

Answer 1

What about something like?

  cancelAnimationFrame(this.id);// Stop the animation
    this.renderer.domElement.addEventListener('dblclick', null, false); //remove listener to render
    this.scene = null;
    this.projector = null;
    this.camera = null;
    this.controls = null;
    empty(this.modelContainer);

function empty(elem) {
    while (elem.lastChild) elem.removeChild(elem.lastChild);
}

This was a reference to this old SO post: How can I destroy THREEJS Scene?