jQuery nesting DOM nodes > 3 levels deep

Trying to nest newly created DOM nodes 3 levels deep. I'm using the following code:

var dom = $('<div>').append('<a>').append('<span>');

result of code above:

<div>
     <a></a>
     <span></span> 
</div>

desired 开发者_StackOverflow中文版output:

<div>
     <a>
          <span></span>
     </a>
</div>

---

var dom = $('<div>').append('<a><span>')

---

var dom = $('<div />')
              .append(
                  $('<a />')
                      .append(
                          $('<span />')));