How to append content to querySelectorAll element with innerHTML/innerText?

user_1231561 0
Viewed 51304

I currently have my class element:

var frame_2 = document.querySelectorAll(".name");

Currently this div is empty. I now want to "append/add" some content to that div - I had a go with innerHTML + innerText but for some reason nothing seems to be added.

Example:

frame_2.innerHTML = '<img src="image.gif" />';

and

frame_2.innerText = 'some text';

Any suggestions? Im not sure if there are ways of doing the same - or performance'wise something better?

innertext innerhtml append javascript
2 Answers

Easier solution, any use case. Query your selector:

let find = document.querySelector('.selector');

create some html as a string

let html = `put your html here`;

create element from string

  let div = document.createElement('div');
  div.innerHTML = html;

Append new html you created to selector

find.appendChild(div);
user_13742720
Related