jQuery Selector: Id Ends With?

Question

Is there a selector that I can query for elements with an ID that ends with a given string?

Say I have a element with an id of ctl00$ContentBody$txtTitle. How can I get this by passing just txtTitle?

Answer 1

An example: to select all <a>s with ID ending in _edit:

jQuery("a[id$=_edit]")

or

jQuery("a[id$='_edit']")

Answer 2

The answer to the question is $("[id$='txtTitle']"), as Mark Hurd answered, but for those who, like me, want to find all the elements with an id which starts with a given string (for example txtTitle), try this (doc) :

$("[id^='txtTitle']")

If you want to select elements which id contains a given string (doc) :

$("[id*='txtTitle']")

If you want to select elements which id is not a given string (doc) :

$("[id!='myValue']")

(it also matches the elements that don't have the specified attribute)

If you want to select elements which id contains a given word, delimited by spaces (doc) :

$("[id~='myValue']")

If you want to select elements which id is equal to a given string or starting with that string followed by a hyphen (doc) :

$("[id|='myValue']")

Answer 3

$('element[id$=txtTitle]')

It's not strictly necessary to quote the text fragment you are matching against

Answer 4

Since this is ASP.NET, you can simply use the ASP <%= %> tag to print the generated ClientID of txtTitle:

$('<%= txtTitle.ClientID %>')

This will result in...

$('ctl00$ContentBody$txtTitle')

... when the page is rendered.

Note: In Visual Studio, Intellisense will yell at you for putting ASP tags in JavaScript. You can ignore this as the result is valid JavaScript.

Answer 5

Try this:

<asp:HiddenField ID="0858674_h" Value="0" runat="server" />

var test = $(this).find('[id*="_h"').val();

Answer 6

In order to find an iframe id ending with "iFrame" within a page containing many iframes.

jQuery(document).ready(function (){     
                  jQuery("iframe").each(function(){                     
                    if( jQuery(this).attr('id').match(/_iFrame/) ) {
                            alert(jQuery(this).attr('id'));

                     }                   
                  });     
         });