Why is this JQUERY selector with a varibale and space not working?

Question

 $(".lookup "+id).css("background-color","green");

I want to to change the background of "lookup 123456" to green when matches are found. I write this to the console: console.log(".lookup "+id) it works fine. But it's not getting selected with the selector.

Any help?

Its' a variable which contains the id - yes. The question has been answered below, thanks. — PHPWhisperer, Jun 28 '15 at 10:05

score 2 · Accepted Answer · edited Jun 28 '15 at 10:05

2

Use the following code:

$("[class='lookup "+id+"']").css();

edited Jun 28 '15 at 10:05

insertusernamehere

21,742
7
80
113

answered Jun 28 '15 at 10:01

Aqib1604

272
1
7

@PHPWhisperer it works because it selects based on the value of the class attribute of the elements, the reason why you are unable to use the class selector is because you can't have a space in a class name (what you have is two class names but the second is invalid since it starts with a number) – Matthew Mcveigh Jun 28 '15 at 10:07
It will Work In your code its taking use space to select the child tag so when you use spaces directly it will go and check for lookup class. So we have to tell jQuery that this full class with space is name. – Aqib1604 Jun 28 '15 at 10:07
if it's not containg number this works because your looking for the attribute [class="lookup 78789789"] since your using a number as a class which is not allowed this works becuase it's not using the jquery default class finder.. – vimes1984 Jun 28 '15 at 10:08

score 2 · Answer 2 · answered Jun 28 '15 at 10:05

I'm not pretty clear about what you're looking for.

If you want to select elements with class="lookup 123456" then you should use . not space. Example:

$('.lookup.' + id);

If you want to select elements with class="lookup" id="123456" then you should use # not space. Example:

$('.lookup#' + id);

Your current selector is meaning select something like this.

<div class="lookup">
  <123456></123456>
</div>

score 1 · Answer 3 · answered Jun 28 '15 at 10:05

I am considering variable id holds id of element.

Assume id="something"

then if you use your code

 $(".lookup "+id).css("background-color","green");

is equal to

 $(".lookup something").css("background-color","green");

where something is not an element there should be # to select by id. so try this code

 $(".lookup #"+id).css("background-color","green");

This will be

 $(".lookup #something").css("background-color","green");

score 0 · Answer 4 · edited May 23 '17 at 11:58

A selector can not start with a number.

http://www.w3.org/TR/CSS21/syndata.html#characters

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-z0-9] and ISO 10646 characters U+00A1 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

Which characters are valid in CSS class names/selectors?

Why is this JQUERY selector with a varibale and space not working?

4 Answers4