How To Dynamically Change The Image Pattern In Svg Using Javascript

How can I dynamically change/add an image pattern into an existing SVG on my page using Javascript? Or any library. This is what I've got so far.. function addSvgStuff(svg, id) {

Solution 1:

You neeed to use setAttributeNS to set attributes that are in the xlink namespace so

    image.setAttribute('xlink:href', 'http://www.jampez.co.uk/sensoryuk/events/test.jpg');

should be

    image.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', 'http://www.jampez.co.uk/sensoryuk/events/test.jpg');