How to add td after a td

Question

I have a td and I want to add a new one, but my new td is shown as text on my page, what am I missing my code :

        var firstTd = parent.document.getElementById("currentTd");           
        firstTd.after('<td><span>teste</span></td>');

Answer 1

See the documentation :

The Element.after() method inserts a set of Node or string objects in the children list of the Element's parent, just after the Element. String objects are inserted as equivalent Text nodes .

So pass an element instead.

const firstTd = parent.document.getElementById("currentTd");           
const secondTd = document.createElement('td');
const span = document.createElement('span');
span.textContent = "teste";
secondTd.appendChild(span);
firstTd.after(secondTd);

or consider insertAdjacentHTML