Връщане на HTML елементи

Използвам малко JavaScript за създаване на нови HTML елементи и след това ги връщам с помощта на метода за инжектиране на MooTools.

 display: function() {
        var threadTitle = new Element('h2',{
            'class': 'postItem',
            'data-id': this.id,
            'text': this.title,
            'href': '#',
            events: {
                click: function(){
                    $('newComment').setStyle('visibility', 'visible');
                    var id = this.get('data-id');
                    $('thread').value = id;
                    callThread(id);
                }
            }
        });

        var deleteT = new Element('a',{
            'class': 'deleteItem',
            'data-id': this.id,
            'text' : 'Delete',
            'href' : '#',

            events: {
                click: function(){
                    var deleteID = this.get('data-id');
                    deleteThread(deleteID)
                }
            }
        });

        var editBtn = new Element('input',{
            'class': 'mt-btn',
            'value': 'Edit',
            'type': 'button',
            'data-id': this.id,
            'text' : 'Edit',
            'href' : '#',
            events: {
                click:  function(){


                }
            }
        });



        deleteT.inject(threadTitle);
        editBtn.inject(threadTitle);
        return threadTitle;
    }
});

Това очевидно връща новите елементи вътре в h2, докато инжектирам в него. Има ли начин да се създаде всеки един извън H2, така че в известен смисъл

<h2></h2>
<a></a>
<input></input>

Опитах да използвам начина на MooTools за използване на editBtn.inject(threadTitle, 'after');, но това изглежда не работи и нищо не се връща. Въпросът е как да върна елементите на страницата един след друг, без да бъдат инжектирани в елемента h2.