JavaScript innerHTML
<p>Why doesn't this work? innerHTMl cannot take in sth so complicated?</p>

<pre><code>&lt;html&gt;
&lt;head&gt;
    &lt;script type="text/javascript"&gt;
        function addTable() {
            var html = "&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;label for="name"&gt;Name:&lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;input type="text" id="name"&gt;&lt;/input&gt;&lt;/td&gt;&lt;/tr&gt;"; +
                "&lt;tr&gt;&lt;td&gt;&lt;label for="remarks"&gt;Remarks:&lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;input type="text" id="remarks"&gt;&lt;/input&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
            document.getElementById("addtable").innerHTML = html;
        }
    &lt;/script&gt;


&lt;/head&gt;
&lt;body&gt;
    &lt;input type="submit" value="New Table" onClick="addTable()"/&gt;
    &lt;div id="addtable"&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>something less complicated like this works: </p>

<pre><code>var html = "&lt;table&gt;&lt;tr&gt;&lt;td&gt;123&lt;/td&gt;&lt;td&gt;456&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
</code></pre>
