jQuery - multiple :not selector

Question

I\'m trying to target page-wide links that do not start with a \'#\' and do not include in-line javascript but I\'m having problems figuring out how to structure the selecto

Answer 1

Try using

$('a:not([href*=javascript]):not([href^=#])') ...

Answer 2

As indicated in jQuery - Multiple Selectors in a :not()? , this is the correct way to do this:

$( 'a:not([href*=javascript],[href^=#])' )

---

Don't forget to put quotes around commas if you already already have your selectors to negate in variables

var selOne = '[href*=javascript]';
var selTwo = '[href^=#]';
$('a:not(' + selOne + ',' + selTwo + ')')

I admit that the code gets a bit confusing but it has an advantage, you can do things such as this:

var selOne = '[href*=javascript], [href^=#]';
var selTwo = '.anotherSelector, .andAnother, .andSoOn';
$('a:not(' + selOne + ',' + selTwo + ')')

It's useful whenever you need to group selectors for some reason, ie. using the same group of selectors somewhere else in the code.

---

A live example using the same technic

$('div:not(.rose-flower,.bus-vehicle)').css('color','red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="bus-vehicle">I am a bus</div>
<div class="strawberry-fruit">I am a strawberry</div>
<div class="rose-flower">I am a rose</div>

Also on http://jsfiddle.net/bmL8gz5j/

---

:not vs .not(): For performance reasons, you should use :not rather than .not(), see Performance differences between using ":not" and ".not()" selectors?

Answer 3

You could also try:

$('a').not('[href^=#],[href*=javascript]')