i’m using Highcharts , the chart result is a collection of SVG elements and i was trying to add some elements to this SVG using jquery
Here is what i have tried
function(chart) { // on chart load complete
$("#highcharts-0 Svg").
append(document.createElementNS("http://www.w3.org/2000/svg", "rect"));
$("#highcharts-0 Svg").find("rect").
attr({x : 100 , y:100 , width : 100 , height : 100 });
console.log($("#highcharts-0 Svg "));
});
i can’t really say if this is working or not , all i can see is a <rect></rect> element in my DOM with no attr
another notice is when i hover on this element using chrome console it shows the rec on x-0 , y=0,

i have an idea that jquery does not append svg elements hop i’m wrong
Question How can i add element with attributes to SVG using jquery
EDIT
with help now i have id for the rect element
then i tried to add attr with using the id , but failed
Highcharts also has a drawing API that you can use to draw rectangles. This works also for VML. Check out http://www.highcharts.com/ref/#renderer => rect and live sample at http://jsfiddle.net/gh/get/jquery/1.7.1/highslide-software/highcharts.com/tree/master/samples/highcharts/members/renderer-rect-on-chart/.