I have an anchor tag like this:

<a id="[email protected]" class="big-link" href="">4</a>

Now I am trying to replace the text with the following code

a = 1;
b = 18;
c = "[email protected]";
var tempId = "#"+a+"_"+b+"_"+c;
$(tempId).text("some text");

This never works. I tried .html() and .append(). It looks like it never finds the ID. But it works if I call the event by class name.

$(".big-link").text("some text");

Any clue? Thanks in advance.

I have an anchor tag like this:

<a id="[email protected]" class="big-link" href="">4</a>

Now I am trying to replace the text with the following code

a = 1;
b = 18;
c = "[email protected]";
var tempId = "#"+a+"_"+b+"_"+c;
$(tempId).text("some text");

This never works. I tried .html() and .append(). It looks like it never finds the ID. But it works if I call the event by class name.

$(".big-link").text("some text");

Any clue? Thanks in advance.

• javascript
• jquery
• html

• 1 Can you do a jsfiddle for us? – Adam Merrifield Commented Jan 18, 2013 at 6:46
• 1 First problem I see is the use of @ in your ID and having it begin with a digit. Please see this SO answer for details : stackoverflow./questions/70579/… – Ravi Y Commented Jan 18, 2013 at 6:51
• The snippet works fine in jsfiddle. – shazinltc Commented Jan 18, 2013 at 6:51
• 3 Problem is the @ and . characters in the id. Check this SO answer for the solution stackoverflow./questions/605630/… – Sang Suantak Commented Jan 18, 2013 at 6:53
• jsbin./aqoxij/1 check this out. – Jai Commented Jan 18, 2013 at 7:32

6 Answers 6

The problem is with the way you are constructing your ID values. Issues are

1. Starting with a digit
2. Use of @
3. Use of .

I removed those and jquery text() was working fine for me. Check this fiddle : http://jsfiddle/kDnmu/

HTML

<a id="A_1_18_shazin_mypany-" class="big-link" href="">4</a>

Jquery

a = 1;
b = 18;
c = "shazin_mypany-";
var tempId = "#A_"+a+"_"+b+"_"+c;
$(tempId).text("some text");

For details on what is a valid id check this SO answer: What are valid values for the id attribute in HTML?

EDIT: If you are constructing these IDs dynamically, consider escaping them with some logic of your own.

Try this: http://jsfiddle/LPuTr/

a = 1;
b = 18;
c = "[email protected]";
aaa = a+'_'+b+'_'+c;

$('a[id="'+aaa+'"]').text("some text");

for more info for ids in html 5 see this: http://mathiasbynens.be/notes/html5-id-class

You need to escape the dot(.) and @ characters with \\. try this

$("#1_18_shazin\\@mypany\\.").text("some text");

Try this : http://jsfiddle/HLtz9/10/

You have illegal characters in your id, also an id cannot begin with a digit

What are valid values for the id attribute in HTML?

It looks to me you have to loose period . and alpha @ and then it works!

What are valid values for the id attribute in HTML?

I understand why alpha, but I have no clue for period :/

Here is working JSfiddle

Problem is you are using @ and . in your id

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

@ is not legal for ID while . and : is allowed but one should avoid it because:

For example, an ID could be labelled "a.b:c" and referenced in the style sheet as #a.b:c but as well as being the id for the element, it could mean id "a", class "b", pseudo-selector "c"

.