0

In my app when user clicks on button, browser creates new object. For instance:

$("#div1 svg").append("<ellipse id='#obj0' class='svgobjects'>");

It works. It appears in Chrome development tools. Then I want to set size of my ellipse using some data.

if (!$(ID).length > 0) {
        console.log("Div doesn't exist");
} else {
        console.log("I found it");
}
$(ID).attr("cx", data["startX"]).attr("cy", data["startY"]).attr("rx", this.rx).attr("ry", this.ry).attr("fill", data["color"]);

All of these variables are OK. All of them contains correct data. But in console appears: "Div doesn't exist".

The problem is: this div IS there and have the same id as "ID" variable ("#obj0"). But in spite of all jquery sais that div doesn't exist.

Piotrek
  • 10,919
  • 18
  • 73
  • 136
  • 7
    http://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html remove the # from the id – hex4 Aug 21 '13 at 10:50

2 Answers2

2

If you're selecting your ellipse element using its ID, make sure to set it correctly with a valid value.

With CSS (and therefore with jQuery too) you would use #obj0 to select the element having the ID obj0, but you don't have such element as what you have is an element with an ID defined to #obj0, which is an invalid value.

To solve your problem, replace the following:

$("#div1 svg").append("<ellipse id='#obj0' class='svgobjects'>");

With this:

$("#div1 svg").append("<ellipse id='obj0' class='svgobjects'>");

Edit:

In HTML5 the ID #obj0 is actually valid (see http://www.w3.org/TR/html-markup/global-attributes.html), but in this case you will have to select it using $("#\#obj0") instead of $("#obj0").

Community
  • 4,922
  • 7
  • 25
  • 37
0

IF you are using HTML5 

id="#obj0" is valid ,

then you have to select like $("#\#obj0")

if you are not using HTML5 you should obj0 instead of '#obj0'

Kanishka Panamaldeniya
  • 17,302
  • 31
  • 123
  • 193