JavaScript JavaScript and the DOM Making Changes to the DOM DOM Manipulation

Guadalupe Favela
Guadalupe Favela
5,986 Points

Can someone help understand?

Im not sure if im creating a class correctly. can someone help with this line of code?

app.js
var contentDiv = document.getElementById('content');
var newParagraph = document.createElement('p');
newParagraph.ClassName = 'panel' ;
index.html
<!DOCTYPE html>
<html>
    <head>
        <title>DOM Manipulation</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <div id="content">

        </div>
        <script src="app.js"></script>
    </body>
</html>

3 Answers

Dmitry Polyakov
Dmitry Polyakov
4,410 Points

className starts with a small letter

newParagraph.className = 'panel' ;

Maxwell Newberry
Maxwell Newberry
Front End Web Development Techdegree Student 7,675 Points

To add to this, this style of naming convention is commonly referred to as camel casing. There are other naming conventions that are often used such as snake casing which use underscores between words like_so. These styles are oftentimes referred as different things depending on the developer.

Although there are no required naming conventions for most languages, depending who you ask, a lot of developers have a preference of when to use camel casing versus snake casing in one language versus the next.

A lot of the commonly used languages such as Javascript are case sensitive, so whatever casing name convention you choose, you will need to use the same casing to reference it later on.

Dmitry Polyakov
Dmitry Polyakov
4,410 Points

Another way to handle classes is classList method

2 examples below show how to add and how to remove classes

newParagraph.classList.add("panel") ;

newParagraph.classList.remove("panel") ;

Guadalupe Favela
Guadalupe Favela
5,986 Points

Thank you both for the feed back!!