0

HTML:

<div class="my-input"><p>Add your information</p></div>

I want to add more DIVs using append, but the browser shows me the text not the result of the code.

JavaScript:

let inputSkill = `<div class="my-input"><p>Add your information</p></div>`;
function addSkill(){
this.parentNode.append(inputSkill);
};
for( btnAddFor of addUserSkill){
    btnAddFor.addEventListener("click", addSkill);
};

Browser Result:

<div class="my-input"><p>Add your information</p></div>

Not

Add your information

Could you please let me know why this is not working?

The best solution will be to use insertBefore but I receive the error "insertBefore on Node: parameter 1 is not of type Node"

function addSkill(){
    this.parentNode.insertBefore(inputSkill, this.parentNode);
};

Thank you in advance!

Andrei
  • 21
  • 5
  • 2
    Have you read the documentation? [`append`](//developer.mozilla.org/en/docs/Web/API/Element/append), [`insertAdjacentHTML`](//developer.mozilla.org/en/docs/Web/API/Element/insertAdjacentHTML). – Sebastian Simon Apr 03 '22 at 10:36
  • Thank you very much, insertAdjacentHTML is my solution! Sorry about the documentation, but I'm a beginner, noob level. – Andrei Apr 03 '22 at 10:54

0 Answers0