javascript - Adding Values to a DOM element after the element has been created -

i'm looking on pretty extensive code web page generated xml/xsl , has javascript generate layout on fly. having troubles seems ie (v.10 specifically) showing elements empty text nodes if there no value, , regular text (no editable field) if there value.

this seems change behavior of straight un-editable text.

from can see, first step javascript generate elements via dom

input = document.createelement("input");  input.setattribute("id", "blah"); input.setattribute("type", "text"); 

then append parent. seems happen function executed runs through page again , inserts values these fields have.

input.value = "hello world"; 

chrome , firefox display input fields fields populated, ie10 show value if plain text.

i've never worked sort of web page generation , hoping might able me figure out can troubleshoot this. changing way works (at time) not option i'm trying correct ie happy too.

thanks

this specific code sequence works in browsers i've tried in (chrome, ie, firefox):

var elem = document.createelement("input"); elem.type = "text"; elem.id = "test"; document.body.appendchild(elem); elem.value = "this text"; 

if exact code deviating this, should examine differences or post exact sequence of code demonstrates problem in ie have better idea how debug or advise.

you can see working demo of in browser want try in here: http://jsfiddle.net/jfriend00/z2fpp/

things watch out in code:

1. is code setting .innerhtml of parent wiping out or resetting child elements.
2. is code setting .innerhtml of input field itself. should not done. code should use .value set text of input field.
3. are there code errors when code runs in ie? check error console or debug console (hit f12 in ie debugger can see error console).
4. are there other attributes being set in input field might make read-only instead of editable?