IE.innerHTML bug.

IE.innerHTML.fix.js

var p;
function buildElement(text){
  var node, 
      doc = document;
  node = doc.createElement('div');
  node.setAttribute('class','node-wrapper');
  
  p = doc.createElement('p');
  p.textContent = text;
 
  node.appendChild(p);
  return node;
}

// create a parent wrapper element
var body = document.body;
var wrapper = document.createElement('div');
wrapper.setAttribute('class','parent-wrapper');
body.appendChild(wrapper);

var childNode = buildElement('This is a sample');

// This will append a child node with all of its children, 
// everything works as expected - ex:
// <div class="parent-wrapper">
//   <div class="node-wrapper">
//     <p>This is a sample</p>
//   </div>
// </div>
wrapper.appendChild(childNode);
// childNode.innerHTML = "<p>This is a sample</p>";
// p.textContent = "This is a sample"


// empty the parent wrapper
for(var i=0,len = wrapper.childNodes.length; i < len; i++){
  wrapper.removeChild(wrapper.childNodes[i]);
}
// childNode.innerHTML = "<p>This is a sample</p>";
// p.textContent = "This is a sample";


// re-append the childNode element to the parent wrapper
// in IE, this step will fill the parent node with just the node-wrapper element
// with the removed child node(s) - ex:
// <div class="parent-wrapper">
//   <div class="node-wrapper" />
// </div>
wrapper.appendChild(childNode);
// childNode.innerHTML = "<p>This is a sample</p>";
// p.textContent = "This is a sample";

IE.innerHTML.js

var p;
function buildElement(text){
  var node, 
      doc = document;
  node = doc.createElement('div');
  node.setAttribute('class','node-wrapper');
  
  p = doc.createElement('p');
  p.textContent = text;
 
  node.appendChild(p);
  return node;
}

// create a parent wrapper element
var body = document.body;
var wrapper = document.createElement('div');
wrapper.setAttribute('class','parent-wrapper');
body.appendChild(wrapper);

var childNode = buildElement('This is a sample');

// This will append a child node with all of its children, 
// everything works as expected - ex:
// <div class="parent-wrapper">
//   <div class="node-wrapper">
//     <p>This is a sample</p>
//   </div>
// </div>
wrapper.appendChild(childNode);
// childNode.innerHTML = "<p>This is a sample</p>";
// p.textContent = "This is a sample"

/* 
 *  Try another browser or comment out the following lines
 *  To see how it should work/ how it's expected to work.
 */
// empty the parent wrapper
wrapper.innerHTML = '';
// childNode.innerHTML = "";
// p.textContent = "This is a sample";


// re-append the childNode element to the parent wrapper
// in IE, this step will fill the parent node with just the node-wrapper element
// with the removed child node(s) - ex:
// <div class="parent-wrapper">
//   <div class="node-wrapper" />
// </div>
wrapper.appendChild(childNode);
// childNode.innerHTML = "";
// p.textContent = "This is a sample";