title: Javascript innerHTML not working in IE
body: <p>I need to create a web application where the user drags and drops a task name, then the corresponding task name has to appear in a table. </p>
  
  <p>When this happens a new row has to be added when the drop occurs. </p>
  
  <p>I have used javascript for drag and drop and to add the new row.</p>
  
  <p>My code works in chrome and firefox but not in IE. Why?</p>
  
  <p>here is a sample of my code.</p>
  
  <pre><code>&lt;script type = "text/javascript"&gt;
  
  var trNumber = 1;
  
  function addTimeSheetRow(){
      var timeSheetBody = document.getElementById("timeSheetBody");
      var trow = document.createElement("tr");
  
      trow.innerHTML = "&lt;th ondragstart='return false;' ondrop='return false;'&gt;&lt;/th&gt;" +
      "&lt;th ondrop='drop(event)' ondragover='allowDrop(event)' value='' class='dropTexts'&gt;&lt;/th&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Mon") + " type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Tue") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Wed") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Thu") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Fri") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Sat") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td&gt;&lt;input name=" + getTrDayNames("Sun") + "  type='text' value='' size='2'/&gt;&lt;/td&gt;" +
      "&lt;td class='total'&gt;&lt;input type='text' value='0' size='2' readonly='readonly'/&gt;&lt;/td&gt;"; 
  
      timeSheetBody.appendChild(trow);
  
      $("tbody#timeSheetBody td input:not(.intial)").each(function() {
          $(this).keyup(function(){
              newSum.call(this);
              colSum.call(this);
  
          });
      });
  
      document.getElementsByName("trNumber")[0].value = trNumber;
  }
  
  function allowDrop(ev)
  {
      //ev.preventDefault();
      ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
  }
  function drag(ev)
  {
      ev.dataTransfer.setData("Text",ev.target.id);
      //var projectElement = ev.target.parentNode;
      //ev.dataTransfer.setData("Text", projectElement.getAttribute("id"));
      //alert(projectElement.getAttribute("id"));
  }
  
  function drop(ev)
  {
      //ev.preventDefault();
      ev.preventDefault ? ev.preventDefault() : ev.returnValue = false;
      var data = ev.dataTransfer.getData("Text");
      var taskName =document.getElementById(data).innerHTML;
      //alert(taskName);
      var trTaskName = "tr" + trNumber + "TaskName";
      ev.target.innerHTML = taskName + "&lt;input name=" + trTaskName + " type='hidden' value='" + taskName + "' size='2' class='intial'/&gt;";
  
  
      var projectName = document.getElementById(data).parentNode.getAttribute("id");
      //alert(projectName);
      var projectTextBox = ev.target.parentNode.children[0];
      var trProjectName = "tr" + trNumber + "ProjectName";
      projectTextBox.innerHTML = projectName + "&lt;input name=" + trProjectName + " type='hidden' value='" + projectName + "' size='2' class='intial'/&gt;";
  
  
      trNumber = trNumber + 1;
  
      addTimeSheetRow();
  }
  </code></pre>