This code cant find the div with a specific id

Question

If you try this code here:

I'm trying to find a div with id "test" and if I don't find, I create it. The problem is that if I call this function many times, it re-creates the div all the time:

var divClasses = $('‪#test');
if (divClasses.length==0) {
    divClasses = $('<div />', { id:"test" }).appendTo('body');
    console.log('anormal !');
}

How comes?

I think he just create #test if it doesn't exist, and then, update it. — enguerranws, Feb 18 '14 at 10:50
Possible duplicate, http://stackoverflow.com/questions/4153784/jquery-find-if-div-with-id-x-exists-inside-a-dom-string — Vijayakumar Selvaraj, Feb 18 '14 at 10:51
What about remove `divClassess = bla bla bla` and put this one: `$('
');` inside your `if` statement — Pavlo, Feb 18 '14 at 10:53

score 7 · Accepted Answer · edited Feb 18 '14 at 11:07

7

Your keyboard must be producing different characters than expected, either your ' or # is incorrect. Can't figure out which one precisely since my Chrome dev tools keep crashing when playing with those characters..

You can see the difference between your '#test'

encodeURIComponent('#test')
-> "%E2%80%AA%23test"

and a #test typed in an english keyboard

encodeURIComponent('#test')
-> "%23test"

I think it's that opening quote, perhaps.

enter image description here

edited Feb 18 '14 at 11:07

Royi Namir

144,742
138
468
792

answered Feb 18 '14 at 11:00

Karolis

2,899
2
23
38

I copy it to console , but it's not like your result – Royi Namir Feb 18 '14 at 11:04
The is an invisible unicode character called "LEFT-TO-RIGHT EMBEDDING". Not sure about its purpose though. – dfsq Feb 18 '14 at 11:04
That's some weird quote there - it acts as a normal quote, i.e. it works as a string opening character, etc. but that left-to-right embedding confuses Chrome console. When the cursor goes past that character.. it jumps to the beginning of the string. – Karolis Feb 18 '14 at 11:09
How did this invisible character get embedded, is it some sort of RTL thing? – Karolis Feb 18 '14 at 11:10
I also noticed this weird behavior of cursor. – dfsq Feb 18 '14 at 11:10
@RoyiNamir it doesn't work if you paste from my answer, since the stackoverflow input 'sanitizes' that invisible character in some way. But if you paste the string from the original fiddle, you'll see that character in there. – Karolis Feb 18 '14 at 11:10
@Karolis it is the same . 0D0A – Royi Namir Feb 18 '14 at 11:12
Here is the info that might be relevant: https://www.w3.org/International/questions/qa-bidi-controls.en.php?changelang=en – dfsq Feb 18 '14 at 11:14
`encodeURIComponent` produces same result, in my chrome (without copy and paste) – Amir Sherafatian Feb 18 '14 at 11:26
`That's some weird quote there - it acts as a normal quote` <= +1! **It should not act as a normal quote** hence my question! Is that a bug or whatever? Anyway thank you very much for the catch! – Olivier Pons Feb 19 '14 at 10:54

score 2 · Answer 2 · answered Feb 18 '14 at 10:57

2

I checked out your jsfiddle. After changeing single quotes to double quotes it worked.

var divClasses = $('‪#test');

to

var divClasses = $("#test");

answered Feb 18 '14 at 10:57

wumpz

8,257
3
30
25

Yep thats right it does say in the jquery spec to use double quotes http://contribute.jquery.org/style-guide/js/ "Strings should always use double-quotes instead of single-quotes." – Dominic Green Feb 18 '14 at 11:01
How could it impact on this? I know that we could have the problems when using strings, json obj. etc.. but here `$('#test')` ? – Pavlo Feb 18 '14 at 11:02
It has nothing to do with quotes. See Karolis answer. – dfsq Feb 18 '14 at 11:07
Phew! So, my first comment is still valid :) – Pavlo Feb 18 '14 at 11:11

Akhil · Answer 3 · 2014-02-18T11:03:36.747

1

Solution try this

 if (!$('#test').length)  
 {    
   divClasses = $('<div />', { id:"test"}).appendTo('body');  
    console.log('anormal !');  
}

try removing that div and it should create a new one with same ID.

edited Feb 18 '14 at 11:03

answered Feb 18 '14 at 10:58

Akhil

1,073
1
9
28

enguerranws · Answer 4 · 2014-02-18T11:02:01.743

-1

You could just change the .append() to the html() method, which fits more on what you're trying to do : http://jsfiddle.net/8BEpZ/4/

Et sinon, il faut vraiment arrêter de placer des styles directement avec JS, et encore moins des attributs de style HTML ;)

edited Feb 18 '14 at 11:02

answered Feb 18 '14 at 10:53

enguerranws

8,087
8
49
97

2

How your code differs from the OP's? `var divClasses = $('‪#test'); if (divClasses.length==0) {` – Pavlo Feb 18 '14 at 10:54

score -1 · Answer 5 · answered Feb 18 '14 at 11:01

-1

Try this:

var divClasses = $('‪#test');
if (divClasses == null) {
    divClasses = $('<div />', { id:"test" }).appendTo('body');
    console.log('anormal !');
}

answered Feb 18 '14 at 11:01

Akhilesh

1,064
15
28

Please add comments if you are down-voting any answer... It will help the user to provide better answers in the future. – Akhilesh Mar 26 '14 at 12:12

This code cant find the div with a specific id

5 Answers5