Jquery targeting SVG element in separated file

Question

I'm trying to apply a svg filter on a video, actually it works with webkit if I use an external svg file with the -webkit-mask: url(mask.svg) property.

The problem is that I want to target an element in the mask to change it's attribute. It works smooth if I put svg code in the same file with the html, but Jquery can't access the element outside of the html document in the mask.svg.

So with the SVG and html in the same file I can target with

var mask = $('#mask1 #group #circle')[0];

But as webkit doesn't work with svg embedded in the same file due to the webkit-mask specifiy CSS attribute, is there a way in jquery to target element outside of the actual html code?

Thank you a lot!

Ph

Answer 1

you can't target anything from within the document outside of the document. What you could do is maybe use an include statement to make your code a little prettier or load the svg on the fly. from there then you can style it at will using CSS.