Change the height / width of an SVG object using JavaScript

Question

I want to change the height or width when a button is clicked. I try this but don't work:

function modify(){
    document.getElementById('cercle1').style.height = "10px";
    document.getElementById('cercle1').style.width = "10px";        
}

Answer 1

In SVG, the width and height of elements <rect>are attributes, not CSS properties, so you need to write

document.getElementById('cercle1').setAttribute("height", "10px");

similarly for width.