Jquery variable in selector not selecting the div

Question

Here are the lines in my function that should be selecting the div

var t=1;
var problemId=1234;
var x="#problemTypeDtl&" +t+"_"+problemId;
$(x).Text('bites');

Here is the div:

 <tr>
    <td colspan="2">
       <div class="problemStatusType" id="problemTypeDtl&1_1234"></div>
    </td>
 </tr>

It looks like the the selector is not selecting the div...what am I doing wrong?

Thanks in advance.

Pretty sure the ampersand in your div ID is not legal (depending on your doctype) which would in turn break any use of `getElementById()`. See http://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html/79022#79022 — Phil, Aug 01 '11 at 06:02

score 2 · Answer 1 · answered Aug 01 '11 at 06:05

2

Try escaping the ampersand:

var x="#problemTypeDtl\\&" +t+"_"+problemId;

answered Aug 01 '11 at 06:05

Oscar Del Ben

4,375
1
24
41

score 1 · Accepted Answer · answered Aug 03 '11 at 11:44

Why don't you make an all encompassing class called problemTypeDt along with problemStatusType (because I don't know if you need to keep that for something else) and use the problem ID as well...an ID. So

Script

var t=1;
var problemId=1234;
var x=t+"_"+problemId;
$("div.problemTypeDt#"+x).Text('bites');

Markup

<tr>
    <td colspan="2">
       <div class="problemStatusType problemTypeDt" id="problemTypeDtl&1_1234"></div>
    </td>
 </tr>

As noted above in the comments, it is illegal to use an ampersand.

Jquery variable in selector not selecting the div

2 Answers2