Как объединить непустые, отключенные узлы?

Когда я пытаюсь создать последовательность отключенных узлов DOM, используя.afterработает нормально, если они пусты:

[14:56:45.186] $('<span></span>').after('<p></p>');
[14:56:45.193] ({0:({}), length:2, prevObject:{0:({}), length:1}, context:(void 0), selector:".after([object Arguments])", 1:({})})

Но если я попытаюсь добавить какой-либо текст в первый узел, произойдет сбой:

[14:56:41.521] $('<span>test</span>').after('<p></p>');
[14:56:41.525] ({0:({}), length:1})

Если я присваиваю этот результат переменной и пытаюсь проверить его, он выглядит так, как будтоafter никогда не был вызван вообще.

Какие'что происходит здесь, и как мне обойти это?

Изменить: Для тех, кто заинтересован, я написал следующие обертки, которые, кажется, делают мою жизнь намного проще:

function tag(name) {
    return function(contents, options) {
        var o = options || {};
        var is_array = $.type(contents) === "array";
        if (!is_array) {
            o.text = contents;
        }
        result = $('', o);
        if (is_array) {
            $.each(contents, function(i, child) { result.append(child); });
        }
        return result;
    }
}
var span = tag('span');
var div = tag('div');