Создание функции JS для динамического создания элементов HTML и вставки их друг в друга

Question

Я создал функцию ниже, чтобы динамически создавать элементы HTML и добавлять их туда, где я хочу. Консоль не регистрирует никаких ошибок при ее запуске, но второй элемент (<p>) не записывает в документ.

Я думаю, что ошибка связана с переменной «createdDiv», но я не смог изолировать то, что происходит неправильно.

Любая помощь была бы принята с благодарностью!

//Array of elements to be created 

var createdElements = [ 
    [ 'div', 'Class0', 'ID0'], 
    ['p', 'Class1', 'ID1']  
]; 


//function to create and append elements to document 

function createHTML(typeOfCreatedElement ,createdElementClass, createdElementId, locationForCreatedElement){ 
    var createdElement = document.createElement(typeOfCreatedElement); 
    createdElement.className = createdElementClass; 
    createdElement.id = createdElementId; 

    locationForCreatedElement['appendChild'](createdElement); 

    return createdElement; 
} 


//run function 2x; 
//createdDiv successfully writes to the document, but createdParagraph disappears into a black hole... 

var createdDiv = createHTML(createdElements[0][0], createdElements[0][1], createdElements[0][2], document.body); 
var createdParagraph = createHTML(createdElements[1][0], createdElements[1][1], createdElements[1][2], createdDiv); 

Answer 1

вы можете попробовать с помощью этого метода обновления createHTML()

function createHTML(typeOfCreatedElement ,createdElementClass, createdElementId, locationForCreatedElement){ 
    var createdElement = document.createElement(typeOfCreatedElement); 
    createdElement.className = createdElementClass; 
    createdElement.id = createdElementId; 
    createdElement.innerHTML = "this is a sample text for element type " + typeOfCreatedElement; 

    locationForCreatedElement.appendChild(createdElement); //line that I have changed. 

    return createdElement; 
} 

appendChild является метод, а не свойство.