-11 Vote

jQuery: Show and Hide multiple Elements at once

Question by Guest | 2016-09-27 at 21:11

If I want to make a single element visible or invisible using JavaScript or jQuery, I can just call one of the functions .show(), .hide() or .toggle() with the ID of the corresponding element. For example, I can write $("#abc").hide() for hiding the element with the ID "abc".

However, now I want to hide or show multiple elements altogether collectivity. I have tried to assign the same ID to each element, but this is not working (I think, an ID should be unique and not assigned more than once).

What can I do in this case? How to display or hide multiple elements at once?

ReplyPositiveNegative
Avatar Stefan Trost
2Best Answer2 Votes

In this case, I would address the elements by their class.

Just give all elements you want to handle together the same class. That is for example:

<div class="a">DIV</div>
<p class="a">Paragraph</p>
<button class="a">Button</button>

With this, you can formulate a jQuery selector addressing all of those elements at the same time:

$(".a").show();
$(".a").hide();
$(".a").toggle();

These lines would show, hide or toggle all elements with the class "a".
2016-09-28 at 19:13

ReplyPositive Negative
Reply

Related Topics

jQuery: Show and hide elements

Tutorial | 0 Comments

How to Replace multiple Texts at the same Time

Tutorial | 0 Comments

jQuery: Show or hide DIV-Container depending on Checkbox State

Tutorial | 0 Comments

HTML: Difference between ID and CLASS

Info | 0 Comments

jQuery: Does an Element exist?

Tip | 1 Comment

jQuery: Count Elements, Images, Classes etc

Tip | 0 Comments

jQuery: Show a DIV - Hide other DIVs

Tutorial | 0 Comments

Important Note

Please note: The contributions published on askingbox.com are contributions of users and should not substitute professional advice. They are not verified by independents and do not necessarily reflect the opinion of askingbox.com. Learn more.

Participate

Ask your own question or write your own article on askingbox.com. That’s how it’s done.