745

I'm trying to use a wildcard to get the id of all the elements whose id begin with "jander". I tried $('#jander*'), $('#jander%') but it doesn't work..

I know I can use classes of the elements to solve it, but it is also possible using wildcards??

<script type="text/javascript"> var prueba = []; $('#jander').each(function () { prueba.push($(this).attr('id')); }); alert(prueba); }); </script> <div id="jander1"></div> <div id="jander2"></div> 
4
  • 2
    This is a question about jQuery (or more exactly the Sizzle engine). Commented Mar 21, 2011 at 10:37
  • 1
    Just a note: It would be much faster to do it with classes as jQuery or Sizzle can make use of browser functions (should not make much of a difference for modern browsers though). Commented Mar 21, 2011 at 10:47
  • 4
    possible duplicate of JQuery selector regular expressions Commented Aug 31, 2011 at 9:39
  • 8
    Also, an important thing to note is that $("[id*=jander]") would select all elements with an ID containing the string jander. Commented Jul 8, 2012 at 11:03

6 Answers 6

1403

To get all the elements starting with "jander" you should use:

$("[id^=jander]") 

To get those that end with "jander"

$("[id$=jander]") 

See also the JQuery documentation

Sign up to request clarification or add additional context in comments.

3 Comments

The docs give this example: $('input[name^="news"]').val('news here!')
This accepted answer is incorrect and doesn't work. Brenden's comment is correct.
Still works for me (Firefox on Linux)... might be a browser-dependent issue?
136

Since the title suggests wildcard you could also use this:

$(document).ready(function(){ console.log($('[id*=ander]')); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="jander1"></div> <div id="jander2"></div>

This will select the given string anywhere in the id.

Comments

42

Try the jQuery starts-with

selector, '^=', eg

[id^="jander"] 

I have to ask though, why don't you want to do this using classes?

1 Comment

Thanks for the classes hint, that brought me to the right direction!
38

for classes you can use:

div[class^="jander"] 

2 Comments

Don't use it, it tests the pattern against the class attribute value where your class isn't necessarily the first.
Title Be specific and imagine you’re asking a question to another person.
16

To get the id from the wildcard match:

$('[id^=pick_]').click( function(event) { // Do something with the id # here: alert('Picked: '+ event.target.id.slice(5)); } );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="pick_1">moo1</div> <div id="pick_2">moo2</div> <div id="pick_3">moo3</div>

Comments

12

When you have a more complex id string the double quotes are mandatory.

For example if you have an id like this: id="2.2", the correct way to access it is: $('input[id="2.2"]')

As much as possible use the double quotes, for safety reasons.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.