appending div, nested or below?
<p>I'm reading a book on JavaScript that's appending divs to other divs, and I just wanted to get a visual on what that actually looks like. i.e. is the appended div contained within that div it's appended to, or is it just added below it.  Anyways, to figure this out, I created this fiddle which doesn't work <a href="http://jsfiddle.net/mjmitche/S4e4r/" rel="nofollow">http://jsfiddle.net/mjmitche/S4e4r/</a>, where I try to append a div to another already existing div. Can you please explain why I can't get class 'son' appended to id 'dad'? </p>

<p>JavaScript</p>

<pre><code>var element = document.createElement('div');
element.className = 'son';
var dad = getElementById('dad');
dad.appendChild(tit); 
</code></pre>

<p>html</p>

<pre><code>&lt;div id="dad"&gt;

&lt;/div&gt;
</code></pre>

<p>css</p>

<pre><code>.son{

    background-color: red;
    width: 100px;
    height: 100px;

}


#dad{

    width: 100px;
    height: 100px;
    background-color: green;

}
</code></pre>
