can't reset the fill color of the svg path?

Question

I'm using svg in my application and i need to use class in my svg paths. Classes are working fine but i can't change the fill color of the svg path dynamically using setAttribute .

CODE

$('#path1')[0].setAttributeNS(null, "fill", 'blue');

DEMO: Here is the JSFiddle demo

How can i change the fill color of the svg path dynamically if the path with class.
Any suggestions should be appreciated.

Answer 1

You need to change the fill CSS property:

$('#changeFill').click(function(){
    $('#path1').css('fill', 'blue');
});

Example fiddle

Or if you want to keep the property setting in native JS (which would be odd as you're using jQuery to attach the event, but I'm not here to judge):

$('#path1')[0].style.fill = 'blue';