CODEWITHSUNDEEP
javascripthtmlcss
Sharonica
Sharonica

Reputation: 193

Trying to hide Div element with css display:none; doesn't hide it

I have a JS code that creates the div (I created it with JS and not HTML for education purposes):

    var profile = document.createElement('div');
    .... some code...
    document.body.appendChild(profile);

Now in my css file that is associated with the main html file, I have this:

.profile{
    display: none;
}

This does not hide the profile div, and I do not understand why. I assume I am missing something in the CSS file, but after looking in the internet I did not find an answer.

Upvotes: 0

Views: 157

Answers (3)

Sven Jürgens
Sven Jürgens

Reputation: 145

Seems like your <div> does not have the class 'profile'

Have a look at this jsBin.

Upvotes: 2

William Busby
William Busby

Reputation: 102

Add this to your JS code:

var profile = document.createElement('div');
profile.className = 'profile';

Now the css can be applied to this element since it has a class called 'profile'

Upvotes: 2

Oleksii Dniprovskyi
Oleksii Dniprovskyi

Reputation: 135

My advice would be next:

After this line var profile = document.createElement('div'); add a className selector to an element by this profile.className = "your class name here";

Then in CSS use this:

.your class name here{
    display: none;
}

Upvotes: 1

Related Questions