Update Canvas Element With A Dom Canvas

let's say I have var myCanvas = document.createElement('canvas'); and I do myCanvas.setAttribute('id', 'my-canvas'); document.body.appendChild(myCanvas); Afterwords I make change

Solution 1:

You don't have to update myCanvasif it is still the same node. When you create a node and you append it do the DOM then the DOM node is live. It means that all changes on the myCanvas will be immediately reflected in the page.

replaceChild()

In case you want to replace a node with different node you can use .replaceChild() on the parent element of the node you want to replace.

Example:

document.getElementById("parent").replaceChild(element, newElement);

Where parent is the parent element of element.

<div id="parent">
  <canvas id="element"></canvas>
</div>

innerHTML

In your question you are using innerHTML. If you want just to replace a content of one element by a content of another element, then use innerHTML on both of them.

Example:

document.getElementById("element").innerHTML = newElement.innerHTML;