Sonya Blade
Sonya Blade

Reputation: 11

How to assign a class to an SVG element

I'm trying to assign my variable pellet (which is a circle svg) to the class pelClass. For some reason it is not being assigned and is causing a lot of issues. Please help!

function positionPellet() 
{  
    constantCount = 1;

    while(pelletCount < constantCount*3)
    {
    var pellet = document.createElementNS( xmlns, 'circle' );
    pellet.setAttribute( 'cx', Math.random() * window.innerWidth );
    pellet.setAttribute( 'cy', Math.random() * window.innerHeight );
    pellet.setAttribute( 'r' , 10 );
    pellet.className = "pelClass"; //Pellet Class Adding
    pelletCount++;
    pelletList = new Array(pelletCount);
    pelletList.push(pellet);
    svg.appendChild(pellet);
    }
}

Upvotes: 1

Views: 1535

Answers (1)

Robert Longson
Robert Longson

Reputation: 123995

In SVG the syntax is

pellet.className.baseVal = "pelClass"; //Pellet Class Adding

Or alternatively you can use setAttribute (which works the same as html)

pellet.setAttribute('class', "pelClass"); //Pellet Class Adding

Upvotes: 1

Related Questions