Question

I need to hide all the tags which has the ID ‘media’

E.g.:

`<div id='media'>contents</div>`

`<div id='media'>content</div>`

How to do this using JavaScript?

Answer 1

WOAH slow down there for a second buddy!

ID = IDENTIFIER = UNIQUE

You can only use id’s once #id

CLASS = CATEGORY/GROUP = NOT UNIQUE

You can use classes everywhere .class as many times as you’d like.

Don’t make classes named .id, that’s silly.
Don’t make an id named #class, as that is also silly.

document.getElementByClassName(“class”).style.display = ‘none’;

That’ll do it.

Apparently no it won’t, read this SO Question about the problem.

---

jQuery Implementation

Note: All the below examples assume that .hidden is defined in a css file like so:

.hidden {
    display: none;
}

---

Hiding Stuff

to hide something by id:

$("#id").addClass("hidden");

to hide something by class:

$(".class").addClass("hidden");

to hide everything inside of something:

$("#specificSomething *").addClass("hidden");

to hide everything of class bacon within the id stomach:

$("#stomach .bacon").addClass("hidden");

---

Showing Stuff

to show everything that is hidden:

$(".hidden").removeClass("hidden");

to show everything that is hidden inside of something:

$("#specificSomething .hidden").removeClass("hidden);

---

Don’t forget!

You can also use the built in functions, show() and hide(), like so:

$("#specificsomething").hide();

$("#specificsomething").show();

They also have some fancyness built in, like basic animation. Refer to the documentation to use those.

It’s best not to mix and match both of these methods, you can easily confuse yourself and waste plenty of time chasing silly mistakes.

---

Don’t limit yourself!

If you’re new to or unfamiliar with jQuery, don’t forget that you can do things like:

• Hide anything with a specific color.
• Check to see if the first letter of a <p> is a vowel, and hide the entire <p>.
• Hide all the vowels, everywhere, ever.
• Hide anything that the user clicks on (when elaborately animated, is quite fun).

These are just a few (admittedly silly) examples of the magic jQuery is capable of. There’s a whole book full of new and crazy ways to do things. It’s called the documentation. Don’t be afraid of it because it’s large and full of words. Dive in! There are examples for EVERYTHING. Try things just to try them, even if you don’t think they’ll work (you’ll be surprised).

I’ll only give you the easiest of the five examples. I’ll likely come back to this later and stuff it with more awesomeness.

Hide anything when the user clicks on it:

$("*").click(function () { 
     $(this).slideUp(); 
});

---

Wisdom Alert!

Remember, just because you aren’t
doing it right, doesn’t mean you’re
doing it wrong. Sometimes, you aren’t
even doing it at all.

Cheesy Pun Warning!

Remember, it’s always better to stay
classy.