jQuery: Select data attributes that aren't empty?

Question

I'm trying to select all elements that have a data-go-to attribute that is not empty.

I've tried $('[data-go-to!=""]') but oddly enough it seems to be selecting every single element on the page if I do that.

Answer 1

Just as further reference, and an up-to-date ^{(may'14) (aug'15) (sep'16) (apr'17) (mar'18) (mar'19) (may'20) (jan'22)}...
Answer that works with:

###Empty strings: If the attr must exist & could have any value ^{(or none at all)}

    jQuery("[href]"); 

###Missing attributes: If attr could exist & if exist, must have some value

    jQuery("[href!='']"); 

###Or both: If attr must exist & has to have some value...

    jQuery("[href!=''][href]"); 

---

^{PS: more combinations are possible...}

---

###Check this test in jsFiddle for examples:

• jQuery v1.9.1 -> jsFiddle online test
• jQuery v1.11.0 -> jsFiddle online test
• jQuery v2.1.0 -> jsFiddle online test
• jQuery v2.1.3 -> jsFiddle online test
• jQuery v2.2.4 -> jsFiddle online test
• jQuery v3.2.1 -> jsFiddle online test
• jQuery v3.3.1 -> jsFiddle online test
• jQuery v3.4.1 -> jsFiddle online test ^{Last jQuery version available in jsFiddle at jan 10'22}
• jQuery Edge -> jsFiddle online test ^{jQuery edge version (use with caution)}
• jQuery v3.0.0-alpha1 -> jsFiddle online test
• jQuery v3.1.1 Slim -> jsFiddle online test
• jQuery v3.2.1 Slim -> jsFiddle online test
• jQuery v3.3.1 Slim -> jsFiddle online test
• jQuery v3.4.1 Slim -> jsFiddle online test ^{Last jQuery Slim version available in jsFiddle at jan 10'22}

---

###Or here in SO with this Code Snippet.
^{* Snippet is running jQuery v2.1.1}

jQuery('div.test_1 > a[href]').addClass('match'); jQuery('div.test_2 > a[href!=""]').addClass('match'); jQuery('div.test_3 > a[href!=""][href]').addClass('match');

div,a {     display: block;     color: #333;     margin: 5px;     padding: 5px;     border: 1px solid #333; } h4 {     margin: 0; } a {     width: 200px;     background: #ccc;     border-radius: 2px;     text-decoration: none; } a.match {     background-color: #16BB2A;     position: relative; } a.match:after {     content: 'Match!';     position: absolute;     left: 105%; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="test_1">     <h4>Test 1: jQuery('a[href]')</h4>     <a href="test">href: test</a>     <a href="#">href: #</a>     <a href="">href: empty</a>     <a>href: not present</a> </div> <div class="test_2">     <h4>Test 2: jQuery('a[href!=""]')</h4>     <a href="test">href: test</a>     <a href="#">href: #</a>     <a href="">href: empty</a>     <a>href: not present</a> </div> <div class="test_3">     <h4>Test 3: jQuery('a[href!=""][href]')</h4>     <a href="test">href: test</a>     <a href="#">href: #</a>     <a href="">href: empty</a>     <a>href: not present</a> </div>

Answer 2

try

$(':not([data-go-to=""])') 

UPDATE:

For the sake of not leading anyone astray, this answer will work in older versions of jQuery but is not future-proof. Since @gmo and @siva's answers both seem to be working with later versions I defer to (and encourage you to upvote) their answers....and of course hope you have a fantastic day.