best way to inject html using javascript
<p>I'm hoping that this isn't too subjective. I feel there is a definitive answer so here goes.</p>

<p>I want to create this html on the fly using JS (no libraries):</p>

<pre><code>&lt;a href="#" id="playButton"&gt;Play&lt;/a&gt;
&lt;a href="javascript: void(0)" id="muteUnmute"&gt;Mute&lt;/a&gt;
&lt;div id="progressBarOuter"&gt; 
  &lt;div id="bytesLoaded"&gt;&lt;/div&gt;
    &lt;div id="progressBar"&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;div id="currentTime"&gt;0:00&lt;/div&gt;
&lt;div id="totalTime"&gt;0:00&lt;/div&gt;
</code></pre>

<p>using javascript. I know I can do this using createElement etc but it seems extremely long winded to do this for each element. Can anyone suggest a way to do this with more brevity.</p>

<p>I do not have access to a library in this project....so no jquery etc.</p>
