javascript添加子元素和父元素

Question

How to create dynamic image drawing, my javascript foreach element commands:

temp = document.getElementById(docElement);
temp.appendChild(document.createElement('div'));
temp.lastElementChild.innerText = 'text';
temp.appendChild(document.createElement('img'));

docElement is simple another div container it draws:

<div id="docElement">
<div>text</div>
<img></img>
<div>text</div>
<img></img>
<div>text</div>
<img></img>
...
</div>

I wanted:

<div id="docElement">
<div>text<img></img></div>
<div>text<img></img></div>
<div>text<img></img></div>
<div>text<img></img></div>
...
</div>

Answer 1

You are getting in out of the inside div coz you are appending the image to main div docElement . Simply store them in different variable and play with them whatever way you want like this

 temp = document.getElementById("docElement"); innerdiv = document.createElement('div'); temp.appendChild(innerdiv); innerdiv.innerText = 'text'; innerdiv.appendChild(document.createElement('img')); 

 <div id="docElement"> </div> 

Answer 2

temp = document.getElementById(docElement);
var div = document.createElement('div');
div.innerText = 'text';
div.appendChild(document.createElement('img'));     
temp.appendChild(div);