How to make this code work for both IE and Mozilla?

[AdventDeo]

Any ideas on how to make the following code work for both IE and Mozilla?

function AddRow()
{

if (navigator.appName=="Microsoft Internet Explorer")
 var morerow=document.getElementById("tbl").getElementsByTagName("tbody")[0];
else if (navigator.appName=="Mozilla")
 var morerow=document.getElementById("tbl");

 var newtr=document.createElement("tr");
 var xtra=document.getElementById("xtra");
 var dname=document.getElementById("dname");

 morerow.appendChild(newtr);

 var newtd0 = document.createElement("td");
 newtd0.innerHTML = xtra.innerHTML;
 newtr.appendChild(newtd0);

 var newtd1 = document.createElement("td");
 newtd1.innerHTML = dname.innerHTML;
 newtr.appendChild(newtd1);
};

I posted the original question on the PHP forums coz I do not know if the problem lies with the PHP code or the JS. And some posting pro corrected me so here i am now. The following quotes are just for reference.

....
       <table id="tbl">
        <div id="xtra" style="display:none; visibility:hidden">
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        </div>
        <div id="dname" style="display:none; visibility:hidden">
         <input name="Name[]" type="text" size="35">
        </div>
       </table>
....
           <input type="button"  
                  name="Add"
                  value="More Company" 
                  onclick="return AddRow();">
....


//the following javascript  function is saved in another .js file which is then called from the main php file when the above button is clicked. It works fine with Mozilla and Chrome.


function AddRow()
{
 var morerow=document.getElementById("tbl")
 var newtr=document.createElement("tr");
 var dname=document.getElementById("dname");

 morerow.appendChild(newtr);

 var newtd0 = document.createElement("td");
 newtd0.innerHTML = xtra.innerHTML;
 newtr.appendChild(newtd0);

 var newtd1 = document.createElement("td");
 newtd1.innerHTML = dname.innerHTML;
 newtr.appendChild(newtd1);
};

What's wrong with IE8?

I found the solution here:
http://www.rittau.org/blog/20061120-00

Change the first line into:

var morerow=document.getElementById("tbl").getElementsByTagName("tbody")[0];

Heya thank u man! It's working with IE now but it's not working with Mozilla... =(

Tried to add the following code but does not work... Any ideas how to make it work with both browsers?

if (navigator.appName=="Mozilla Firefox")
 var morerow=document.getElementById("tbl");
else if (navigator.appName=="Microsoft Internet Explorer")
 var morerow=document.getElementById("tbl").getElementsByTagName("tbody")[0];

First problem with your script, you are missing a ; on line 24.
Second problem, you haven't created a var called xtra which you try to use on line 31.

Also, why are you mixing DOM standard with innerHTML?

Lastly, this appears to be JavaScript, not PHP. For future reference, there is a JS forum here: Click.

[parry_kulk]

IE always creates the <tbody> in the DOM while rendering whether you have it in the code or not. So have the <tbody> tag in the html code itself like

....
       <table id="tbl">
       <tbody id="tblBody">
     
       </tbody>
        <div id="xtra" style="display:none; visibility:hidden">
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
....

This way you will not require to check the browser type in js and can add the new rows to the 'tblBody' like

function AddRow()
{
 var morerow=document.getElementById("tblBody")
 var newtr=document.createElement("tr");
 var dname=document.getElementById("dname");

  ...............
}

Hope this was useful to you