jQuery exclude elements with certain class in selector

I want to setup a click event trigger in jQuery for certain anchor tags.

I want to open certain links in a new tab while ignoring ones with a certain class (before you ask I cannot put classes on the links I am trying to catch as they come from a CMS).

I want to exclude links with class "button" OR "generic_link"

I have tried:

$(".content_box a[class!=button]").click(function (e) {
    e.preventDefault();     
    window.open($(this).attr('href'));
});

But that doesn't seem to work, also how do I do an OR statement to include "generic_link" in the exclusion?

You can use the .not() method:

$(".content_box a").not(".button")

Alternatively, you can also use the :not() selector:

$(".content_box a:not('.button')")

There is little difference between the two approaches, except .not() is more readable (especially when chained) and :not() is very marginally faster. See this Stack Overflow answer for more info on the differences.

How to find elements by one class, but exclude other using JQuery , You are not using the :not selector correctly. You can select the elements for this scenario either using the not method or the :not selector. Definition and Usage The :not () selector selects all elements except the specified element. This is mostly used together with another selector to select everything except the specified element in a group (like in the example above).

use this..

$(".content_box a:not('.button')")

.not(), Description: Remove elements from the set of matched elements. A string containing a selector expression, a DOM element, or an array of elements to match� In CSS, to exclude a particular class, we can use the pseudo-class :not selector also known as negation pseudo-class or not selector. This selector is used to set the style to every element that is not the specified by given selector. Since it is used to prevent a specific items from list of selected items. Syntax::not(element) { // CSS Property }

To add some info that helped me today, a jQuery object/this can also be passed in to the .not() selector.

$(document).ready(function(){
    $(".navitem").click(function(){
        $(".navitem").removeClass("active");
        $(".navitem").not($(this)).addClass("active");
    });
});
.navitem
{
    width: 100px;
    background: red;
    color: white;
    display: inline-block;
    position: relative;
    text-align: center;
}
.navitem.active
{
    background:green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="navitem">Home</div>
<div class="navitem">About</div>
<div class="navitem">Pricing</div>

jQuery :not() Selector, jQuery :not() Selector. ❮ jQuery Selectors. Example. Select all <p> elements except those with class="intro":. This will return any element that doesn't have the class or property stated inside the parenthesis. In this case, you would put .remode_selected in there. This will target all elements that don't have a class of .remode_selected. Fiddle

How to exclude particular class name from CSS selector , This selector is used to set the style to every element that is not the specified by given selector. Since it is used to prevent a specific items from list� In case one wants to select all elements that do not have either class1 or class2, concatenating would work: $('div[class^="first-"]').not('.class1').not('.class2') – J0ANMM Nov 15 '17 at 12:06 add a comment |

Not class selector in jQuery, Given a list of elements and the task is to not select a particular class using JQuery. jQuery :not() Selector: This selector selects all elements except the Mostly this method is used to remove one or more than one elements� Elements for which the function returns true are excluded from the filtered set; all other elements are included. Note: When a CSS selector string is passed to .not(), text and comment nodes will always be removed from the resulting jQuery object during the filtering process. When a specific node or array of nodes are provided, text or comment nodes will only be removed from the jQuery object if they match one of the nodes in the filtering array.

How to select elements but exclude a string or exclude an element , How to select elements but exclude a string or exclude an element by using JQuery. Here is the code: <div class="content"> <a href="#� jQuery Selectors. jQuery selectors allow you to select and manipulate HTML element(s). jQuery selectors are used to "find" (or select) HTML elements based on their name, id, classes, types, attributes, values of attributes and much more. It's based on the existing CSS Selectors, and in addition, it has some own custom selectors.

Comments
  • So I could do: $(".content_box a").not(".button").not(".generic_link").click(function (e)...?
  • Worked perfectly, even when using .each().
  • It seems that there is a bug when using .text() - the text of the element removed using say .not is still in the text.