jQuery selector not selecting object

Question

So I have some HTML.

<td class="qDescription">
    <div>
         <div id="questionTitle">% of users who logged in per day</div>
         <div id="timeRangeExt"> 05 Mar 2015 - 11 Mar 2015</div>
         <div class="compareToLabel"> (26 Feb 2015 - 04 Mar 2015)</div>
    </div>
</td>

I'm trying to change the CSS property of #timeRangeExt, so I have the following jQuery:

$("#timeRangeExt").html("TESTING");

However, it doesn't work. I'm really at a loss here. I've done this 1000 times before, but this time it just won't select.

Have you checked the ID you're trying to select? You're missing the "Ext" part on the end. — TylerH
– TylerH, Commented Mar 11, 2015 at 20:38
Ya sorry, I edited that. Actually have 2 different IDs, so I mixed them up. To clarify, its still broken. — Jake
– Jake, Commented Mar 11, 2015 at 20:39

Brad Christie · Accepted Answer · 2015-03-11 20:38:58Z

1

~~Need to reference the complete id (#timeRangeExt):~~

~~$('#timeRangeExt').css('color','#f0f');~~

It appears it was a typo. If you have two IDs with the same value (if qDescription is a repeated element) you're going to have to use a class name instead. HTML cannot have two IDs with the same name on a single document. For example, switch it up to:

<td class="qDescription">
    <div>
         <div class="questionTitle">% of users who logged in per day</div>
         <div class="timeRangeExt"> 05 Mar 2015 - 11 Mar 2015</div>
         <div class="compareToLabel"> (26 Feb 2015 - 04 Mar 2015)</div>
    </div>
</td>

Then you can select it in reference to .qDescription:

$('.qDescription .timeRangeExt').css('color','#f0f');

Another options is, if it's dynamically laid out, is to add an incrementing value (e.g. el.id = 'timeRangeExt' + increment;) then, of course, reference it by its new id ($('#timeRangeExt2').css(...)).

answered Mar 11, 2015 at 20:38

Brad Christie

102k16 gold badges160 silver badges200 bronze badges

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

7 Comments

Scimonster Over a year ago

This seems to have been a typo in the question.

Jake Over a year ago

Ya sorry, I edited that. Actually have 2 different IDs, so I mixed them up. To clarify, its still broken.

Brad Christie Over a year ago

If you still can't select it, check you don't have two IDs with the same value. DOM doesn't support it, and browser is probably only picking up on the first instance.

Jake Over a year ago

I do have 2 IDs of the same value. I swear I've done it before, will it work with classes? But for the record, it isn't changing the first one either.

blex Over a year ago

+ wait for the page to be loaded $(function(){ /* code here */ });

|

Ahmad Harb · Accepted Answer · 2015-03-11 20:40:41Z

0

there is a typo in your code and it should be like

$("#timeRangeExt").html("TESTING");

answered Mar 11, 2015 at 20:40

Ahmad Harb

6155 silver badges18 bronze badges

Collectives™ on Stack Overflow

jQuery selector not selecting object

2 Answers 2

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related