Question

I’m trying to understand why you can’t construct a jQuery DOM object with a string and variable (even if the variable is also a string).

//Works
var test1 = $('#test');
test1.addClass('success');

//Works
var test2 = '#test';
$(test2).addClass('success');

//Fails
var test3 = 'test';
$('.' + test3).addClass('success');

//Fails
var id = 'test';
var test4 = '.' + id;
$(test4).addClass('success');

Here’s a jsFiddle to demonstrate.

I feel like I’m probably missing something basic, but I can’t find anything in the jQuery documentation about this.

EDIT: Doh, I should have noticed I used the wrong selectors in the example. I selected mcpDESIGNS’ answer since it did indeed fix my jsFiddle. However, I was still getting an error in my code. (“Uncaught Exception: Syntax error, unrecognized expression: .”) Here’s what was going on in case anyone’s interested:

I was trying to take the current hash in the URL, save the string as a variable, use that to construct a jQuery DOM object, and pass that object into a function.

var hashTag = window.location.hash;
hashTag = hashTag.substr(1);

currentObject = $('.'+hashTag);
setSpriteX(currentObject);

I figured out that I wasn’t accounting for when there wasn’t a hash in the URL. All I needed to do was add hashTag = 'defaulthash'; before I set currentObject.

Answer 1

You need to have $('#' + test3) and var test4 = '#' + id; since you are trying to select by ID‘s not classes.

. // class selector

# // ID selector