Form Submit Problem

Attached is a piece of code that I am using in a dynamic form. For some reason the text input boxes created by this piece of code are passed to the $_POST php server variable in Firefox but not in IE. What have I missed? (I am extremely new to DHTML / Javascript so please forgive me if I am missing something obvious.)


function addDoc() {
arrInputValue[arrInput.length] = new Array(0);
for (intX=0;intX<idents.length;intX++) {
arrInputValue[arrInput.length][intX]="";
}
arrInput.push(arrInput.length);
intQ = arrInput.length -1 ;
docid = "doc_"+intQ;
var newdoc = document.createElement("span");
document.getElementById('AR').appendChild(newdoc);
newdoc.id = docid;
oElement = document.getElementById(docid);
for (intV=0;intV<idents.length;intV++) {
var newipt = document.createElement("input")
oElement.appendChild(newipt);
newipt.type='text';
newipt.id=idents[intV]+arrInput[intQ];
newipt.name=idents[intV]+arrInput[intQ];
newipt.size=boxsize[intV];
newipt.value=arrInputValue[intQ][intV];
newipt.maxlength=boxmaxchr[intV];
oElement.innerHTML += "&nbsp";
}
document.getElementById(docid).innerHTML +="<input type='button' onclick='javascript:addBlurb("+ intQ +",1)' value='Add blurb'><br><span id='blurbs_"+ intQ +"'><b>Blurbs:&nbsp&nbsp</b></span><br><br>";

blurbs[intQ] = new Array(0);
location.hash = 'bottom';
}

I always hate being the first reply to my own thread but i have made a bit of progress on my problem but have not found a complete solution.

The problem has omething to do with innerHTML creating a new html document everytime it is called rather than updating the existing html document, then when the submit button is clicked it submits the unaltered document. For example, if I comment out the following lines in the code I previously posted the dynamicly created fields are passed to the server-side PHP script.


// oElement.innerHTML += "&nbsp";
...
// document.getElementById(docid).innerHTML +="<input type='button' onclick='javascript:addBlurb("+ intQ +",1)' value='Add blurb'><br><div id='blurbs_"+ intQ +"'><b>Blurbs:&nbsp&nbsp</b></div><br><br>";


My problem is that I have no idea how to effectively recreate these lines with DOM.

The first one is fairly easy:



oElement.innerHTML += "&nbsp";

Becomes

oElement.appendChild(document.createTextNode(" "));


But I have no idea how to preserve the text formatting in the second innerHTML segment without a huge increase int eh amount of code written. Is there a DOM function forcreating bold text inside of a span or Div that will contain non-bold select boxes?