How to hide a element using plain JS?

Question

I want to hide a p tag using plain JavaScript. I don't want to use React. I am new to HTML and Javascript. Please excuse if this question doesn't make sense.

Set the `display` style to `none`. Or give it a class whose `CSS` has `display: none;` style. — Barmar, Nov 17 '21 at 16:52
hide it when a button is clicked, when x equals 2, when? have you tried anything? — depperm, Nov 17 '21 at 16:52

score 0 · Answer 1 · answered Nov 17 '21 at 16:56

0

You can hide the p element by setting its display property to none or visibility property to hidden. If you want to completely hide it you can do the following.

document.querySelector('p').style.display = 'none';

answered Nov 17 '21 at 16:56

Juniad Ali

3
3

score 0 · Answer 2 · answered Nov 17 '21 at 16:56

You have to select your html tag in javascript, you can do that by setting a class or an id to your p tag and then set it to display: none;

For example :

<p id="text">My text to hide</p>

let myTextToHide = document.getElementById("text").style.display = 'none';

samcodee · Accepted Answer · 2021-11-17T17:06:42.147

-1

You can hide elements using css. See below:-

setTimeout(() => {
  document.getElementById("p-tag").style.display = "none"
}, 1000)

<p id="p-tag">Hello</p>

edited Nov 17 '21 at 17:06

answered Nov 17 '21 at 16:55

samcodee

103
13

It works. Very helpful for creating a interactive code snippet – RocketFuel Nov 17 '21 at 17:07

How to hide a element using plain JS?

3 Answers3