title: Create neasted elements with jQuery
body: <p>I would like to create div with div inside with jQuery.
  At the beginning in html I have:</p>
  
  <pre><code>&lt;section&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>And after I would like to get:</p>
  
  <pre><code>&lt;section&gt;
      &lt;div class="mate"&gt;
          &lt;div&gt;content&lt;/div&gt;
          &lt;div&gt;content&lt;/div&gt;
          &lt;div&gt;content&lt;/div&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>this is a script:</p>
  
  <pre><code>$.ajax({
              url: "{{addr}}",
              success: function(data) {
              for(i = 0; i &lt; data['team'].length; i++) {
                  $('&lt;div/&gt;',{
                      class:'mate',
                      /* Here is a problem */
                      text: "&lt;div class='name'&gt;"+data['team'][i]['name']+"&lt;/div&gt;",
                      }).appendTo('section');
                  }
              }});
  </code></pre>