<p>I think this is specific to IE 6.0 but...</p>

<p>In JavaScript I add a <code>div</code> to the DOM. I assign an <code>id</code> attribute. When I later try to pick up the <code>div</code> by the <code>id</code> all I get is <code>null</code>.</p>

<p>Any suggestions?</p>

<p>Example:</p>

<pre><code>var newDiv = document.createElement("DIV");
newDiv.setAttribute("ID", "obj_1000");
document.appendChild(newDiv);

alert("Added:" + newDiv.getAttribute("ID") + ":" + newDiv.id + ":" + document.getElementById("obj_1000") );
</code></pre>

<p>Alert prints <code>"::null"</code></p>

<p>Seems to work fine in Firefox 2.0+</p>

[{'answer_id': 52791, 'author': 'David Basarab', 'author_id': 2469, 'author_profile': 'https://Stackoverflow.com/users/2469', 'pm_score': 1, 'selected': False, 'text': "<p>You have to add the div to the dom.</p>\n\n<pre><code>// Create the Div\nvar oDiv = document.createElement('div');\ndocument.body.appendChild(oDiv);\n</code></pre>\n"}, {'answer_id': 52792, 'author': 'Ben Scheirman', 'author_id': 3381, 'author_profile': 'https://Stackoverflow.com/users/3381', 'pm_score': 2, 'selected': False, 'text': '<p>The div needs to be added to an element for it to be part of the document.</p>\n\n<pre><code>document.appendChild(newDiv);\n\nalert( document.getElementById("obj_1000") );\n</code></pre>\n'}, {'answer_id': 52793, 'author': 'harpo', 'author_id': 4525, 'author_profile': 'https://Stackoverflow.com/users/4525', 'pm_score': 0, 'selected': False, 'text': '<p>newDiv.setAttribute( "ID", "obj_1000" );</p>\n\n<p>should be</p>\n\n<p>newDiv.id = "obj_1000";</p>\n'}, {'answer_id': 52805, 'author': 'Shog9', 'author_id': 811, 'author_profile': 'https://Stackoverflow.com/users/811', 'pm_score': 4, 'selected': True, 'text': '<p>In addition to what the other answers suggest (that you need to actually insert the element into the DOM for it to be found via <code>getElementById()</code>), you also need to use a lower-case attribute name in order for IE6 to recognize it as the <code>id</code>:</p>\n\n<pre><code>var newDiv = document.createElement("DIV"); \nnewDiv.setAttribute("id", "obj_1000");\ndocument.body.appendChild(newDiv);\n\nalert("Added:"\n   + newDiv.getAttribute("id") \n   + ":" + newDiv.id + ":" \n   + document.getElementById("obj_1000") );\n</code></pre>\n\n<p>...responds as expected:</p>\n\n<pre><code>Added:obj_1000:obj_1000:[object]\n</code></pre>\n\n<hr>\n\n<p>According to the <a href="http://msdn.microsoft.com/en-us/library/ms536739(VS.85).aspx" rel="noreferrer">MSDN documentation</a> for <code>setAttribute()</code>, up to IE8 there is an optional <em>third parameter</em> that controls whether or not it is case sensitive with regard to the attribute name. Guess what the default is...</p>\n'}, {'answer_id': 52811, 'author': 'Markus', 'author_id': 2490, 'author_profile': 'https://Stackoverflow.com/users/2490', 'pm_score': 0, 'selected': False, 'text': '<p>Hummm, thanks for putting me on the right track guys...this was odd but it turns out that if I change the case to lower case, everything starting working just fine...</p>\n\n<p>Finished Result:</p>\n\n<pre><code>var newDiv = document.createElement("DIV");\nnewDiv.setAttribute("id", "obj_1000");\ndocument.appendChild(newDiv);\n\nalert("Added:" +\n      newDiv.getAttribute("id") + ":" +\n      newDiv.id + ":" +\n      document.getElementById("obj_1000"));\n</code></pre>\n\n<p>ODD...VERY ODD</p>\n'}]
['https://Stackoverflow.com/questions/52785', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/2490/']