-1

I found this post about setting up a query to show/hide elements on a page: Show / Hide elements based on query string value

How do I extend it to show/hide multiple elements?

For instance... Let's say I have six elements on a page with the following classes: .a, .b, .c, .d, .e, .f

With one query I hide: .b,.d,.f and another hide: .a, .c, .e

Two different queries that can handle hiding multiple elements.

Can anyone help out?

Community
  • 1
  • 1
Joseph Sjoblom
  • 171
  • 12
  • Elements can have several classes, separated by spaces in the HTML. What you might do is add a new class to the elements you want to show or hide. – Blazemonger Feb 25 '13 at 17:20

1 Answers1

1

$('.b,.d,.f').hide();

$('.a, .c, .e').hide();

Matt Browne
  • 12,169
  • 4
  • 59
  • 75
  • Perhaps my question wan't completely understood... Using the same model illustrated on the link above, how do I hide multiple elements to that specific query? – Joseph Sjoblom Feb 25 '13 at 17:20
  • @JosephSjoblom That's why it's always a good idea to post the code you've tried. – Blazemonger Feb 25 '13 at 17:20
  • Yeah but that was a question by someone else, it wasn't clear that you were using the exact same code...would have been good to post it in your actual question. Anyway, would `$("div.show_on_success").toggle(document.URL.indexOf("success=true") !== -1); $("div.show_on_something_else").toggle(document.URL.indexOf("something_else=true") !== -1);` be any closer to what you're trying to achieve? – Matt Browne Feb 25 '13 at 17:25
  • Or maybe you're looking for `$("div.show_on_success, div.also_show_on_success").toggle(document.URL.indexOf("success=true") != -1);` – Matt Browne Feb 25 '13 at 17:28
  • sorry, I probably should have posted code... I'll update my post above. – Joseph Sjoblom Feb 25 '13 at 17:30
  • ha! Matt B, just realized after reading your posts all I have to do is separate my class names with commas. doh! – Joseph Sjoblom Feb 25 '13 at 17:34
  • Glad it worked for you :) Yeah, if you were just using spaces before, that means you were checking for descendents with that classname rather than simply checking for multiple classes (just like CSS). – Matt Browne Feb 25 '13 at 17:40