Search code examples
javascriptjqueryidentifier

Selecting an ID with a colon in it with jQuery

I'm working on a pre-written module for a site, and I need to target an element with the id test:two. Now, this element has a colon in it, so jQuery is presumably and understandably seeing the 'two' as a pseudo class. Is there any way of targeting this element with jQuery?

Also, changing the ID is not possible. Believe me, if I could I would.

I've put together an example:

$('#test').css('background','red');
$(document.getElementById('test:two')).css('background','blue');
$('#test:two').css('background','green');
<script src="//code.jquery.com/jquery-1.6.3.js"></script>

<div id="test">test</div>
<div id="test:two">test two</div>

Solution

  • Simply escape the colon with a \\:

    $('#test\\:two');

    http://jsfiddle.net/zbX8K/3/

    See the docs: How do I select an element by an ID that has characters used in CSS notation?.