Solved

jquery not selector with class selector

Posted on 2016-10-20
3
51 Views
Last Modified: 2016-10-21
Hi experts,

I'm using jquery and html

I have this fiddle
https://jsfiddle.net/6yhrwb6o/

If you run it and look at the rendered html with google chrome inspection tool it looks like this:

rendered html
In this fiddle i'm hiding every span that does not contain this string "_DivIconContainer_Row1" in the iD.
I'm using this statement which works.

$("span:not([id*='_DivIconContainer_Row1'])").hide();

But notice how some spans have the class PeachClass and some have the class KiwiClass.

Right now my fiddle is hiding every span that does does not contain this string "_DivIconContainer_Row1" regardless of what class it has on it.


Can i add another criteria to my current fiddle.

So what I want is look for spans that are using the class PeachClass  and then from those spans,  hide every span that does does not contain this string "_DivIconContainer_Row1"

So then the only spans that should be hidden are the ones I highlighted in yellow in this picture:

desired hidden spans are highlighted in yellow
Anyone know how I revise my fiddle?
0
Comment
Question by:maqskywalker
3 Comments
 
LVL 35

Accepted Solution

by:
Robert Schutt earned 500 total points
ID: 41853021
Should be as simple as:

$("span.PeachClass:not([id*='_DivIconContainer_Row1'])").hide();
0
 
LVL 1

Author Closing Comment

by:maqskywalker
ID: 41853028
Thanks. Very nice!
0
 
LVL 55

Expert Comment

by:Julian Hansen
ID: 41853337
Just out of interest (Robert's answer probably still better)
#Div1 span {
 display: none;
}

Open in new window

$('#Div1 span:nth-of-type(5n-4)').show();

Open in new window

0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Jquery-Javascript setAttribute function help 7 18
100% tall div not scrollable on iPhone 3 20
HTML command "mailto:" in windows10 17 53
HTML Anchor Link Problem 3 35
How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
The viewer will learn how to dynamically set the form action using jQuery.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question