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

Question

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.

You need to target the <div> you created and apply the styling to it — Daniel_ZA
– Daniel_ZA, Commented Dec 13, 2016 at 16:29

William Busby · Accepted Answer · 2016-12-13 16:32:04Z

2

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'

answered Dec 13, 2016 at 16:32

William Busby

1023 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Daniel_ZA · Accepted Answer · 2016-12-13 18:01:12Z

2

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

Have a look at this jsBin.

edited Dec 13, 2016 at 18:01

Daniel_ZA

57411 silver badges27 bronze badges

answered Dec 13, 2016 at 16:31

Sven Jürgens

1451 silver badge6 bronze badges

1 Comment

Sharonica Over a year ago

Thanks, I did not mark as the main response but I appreciate it and it helped me!

Oleksii Dniprovskyi · Accepted Answer · 2016-12-13 16:30:42Z

1

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;
}

answered Dec 13, 2016 at 16:30

Oleksii Dniprovskyi

13512 bronze badges

Collectives™ on Stack Overflow

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

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related