convert string to a Node element in javascript

Question

This is my HTML code.

 <div id="ulgallery">
    <ul class="row">
      <li> some item1 </li>
      <li> some item1 </li>
      <li> some item1</li>
    </ul>
    <ul class="row">
      <li> some item2 </li>
      <li> some item2 </li>
      <li> some item2 </li>
    </ul>
  </div>

I have a background ajax program which fetches more

 <ul> ...</ul> <ul> ...... </ul>

data as string. I have a problem in appending this data after the last element.

the final code should look like:

 <div id="ulgallery">
    <ul class="row">
      <li> some item1 </li>
      <li> some item1 </li>
      <li> some item1</li>
    </ul>
    <ul class="row">
      <li> some item2 </li>
      <li> some item2 </li>
      <li> some item2 </li>
    </ul>
   <ul class="row">
      <li> some item3 </li>
      <li> some item3 </li>
      <li> some item3 </li>
    </ul>
   <ul class="row">
      <li> some item4 </li>
      <li> some item4 </li>
      <li> some item4 </li>
    </ul>
  </div>

That is calling the background program gets more data which should append to that last item of . I am not sure how to convert string to node

   document.getElementById("ulgallery").appendChild(node);

Md. Arafat Al Mahmud · Accepted Answer · 2015-03-26 18:40:00Z

1

Set the fetched string as the innerHTML of a dummy div element. Then get the childNodes of the dummy div. This will do the trick. It will convert the string as an array of DOM nodes. Then just iterate through the list and append the nodes to the parent.

Pseudocode:

        var temp = document.createElement('div');
        temp.innerHTML = child; // child is the fetched string from ajax call in your case
        child = temp.childNodes;
        for(var i=0; i<child.length ; i++){
           parent.appendChild(child[i]); 
        }

answered Mar 26, 2015 at 18:40

Md. Arafat Al Mahmud

3,2146 gold badges37 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

convert string to a Node element in javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related