Creating and appending Nodes

Creating and appending Nodes
0.0 0

#1

Hi everyone,

I have been trying to create and append text nodes in my project but there’s something going wrong, any idea what it could be?
I do apologise if the error is silly but I am a beginner.
This is my pen: Link to my Pen

Cheers,

Matt


#2

articleNote.appendChild('noteArticle'); articleNote.appendChild(noteH3); articleNote.appendChild(noteP);

One of these things is not like the others.


#3

I modified your code a little and came up with the following:

function addNoteFunction() {
	var title = document.getElementById('titleID').value; // simplified plus changed innerHTML to value to get field value
	var noteText = document.getElementById('textArea').value; simplified plus changed innerHTML to value to get field value
	var noteArticle = document.createElement('article');
	noteArticle.classList.add('note'); // this was added so the new article would have the same class as the other notes
	var noteH3 = document.createElement('h3');
	var noteP = document.createElement('p');
	noteH3.innerHTML = title;
	noteP.innerHTML = noteText;
	noteArticle.appendChild(noteH3);
	noteArticle.appendChild(noteP);
	document.getElementById("topOfNotes").appendChild(noteArticle); // this actually appends the new note to the correct div called "topOfNotes"
}

#4

Thanks both of you for the replies.
Working great but I’ll study the code you passed me as there are a few things I am not confident about!

Matt


#5

I have just realised I didn’t understand how innerHTML worked, Thanks rmdawson71!

:thumbsup:

Matt