Is it possible to navigate SVG object's elements from enclosing HTML?

Question

I\'m loading an SVG through an object tag and need to access SVG\'s elements (to manipulate them). How can I do that?

Here\'re partial solutions I\'m aware of:

Answer 1

I tried different combinations/solutions suggested here/elsewhere, and looks like the best way to handle SVG is to embed the SVG element in the HTML - just make sure you name it as .xhtml. Once you do that, you can simply navigate the DOM and do what you want (like yankee suggested).

I've verified that this works in the current versions of Chrome, FF, Safari, IE, and Opera. It also works in IE8. Below is a rough example that has a button and a gradient bar - if you click on the button, it turns the bar red.

Color