title: How do I create these nested dom elements with jquery?
body: <p>Given these javascript variables:</p>
  
  <pre><code>var div_id = "my_div";
  var h1_class = "my_header";
  var a_class = "my_a_class";
  var a_string = "teststring";
  </code></pre>
  
  <p>and this page element:</p>
  
  <pre><code>&lt;div id="container"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I want to build this html structure with jQuery:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div id="my_div"&gt;
          &lt;h1 class="my_header"&gt;
              &lt;a href="/test/" class="my_a_class"&gt;teststring&lt;/a&gt;
          &lt;/h1&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What is the best and most readable way to chain the commands here?</p>