CODEWITHSUNDEEP
javascriptdom
fatalbert618
fatalbert618

Reputation: 11

Javascript createElement

I need a quick help setting up the createElement, which is the following:

<h1 class="headingTitle"> ENDANGERED <span class="subHeading">Animals</span> </h1>

I have made this but it produced an error, which is this:

Uncaught Error: NotFoundError: DOM Exception 8 

//Adds 'containr' div to the body
var containerElement = document.createElement('div');
containerElement.setAttribute('class','container');
document.body.appendChild(containerElement);

//Add the ENDANGERED ANIMALS title
var title = document.createElement("h1");
title.setAttribute('class', 'headingTitle');
var text = document.createTextNode("ENDANGERED");

var span = document.createElement('span');
span.setAttribute('class', 'subHeading');
var subText = document.createTextNode("Animals");
span.appendChild(title);
title.appendChild(text);

document.getElementsByClassName('container')[0].appendChild(title);

Upvotes: 1

Views: 3579

Answers (1)

icktoofay
icktoofay

Reputation: 129119

I'm not entirely sure why you're getting that exception (I don't), but you do have a few variables mixed up. Fixed, it looks like this:

var containerElement = document.createElement('div');
containerElement.setAttribute('class', 'container');
document.body.appendChild(containerElement);

var title = document.createElement('h1');
title.setAttribute('class', 'headingTitle');
title.appendChild(document.createTextNode('ENDANGERED '));

var span = document.createElement('span');
span.setAttribute('class', 'subHeading');
span.appendChild(document.createTextNode('Animals'));

title.appendChild(span);
containerElement.appendChild(title);

Try it.

Upvotes: 2

Related Questions