<svg id="svg1" xmlns="http://www.w3.org/2000/svg" version="1.1" width="120" height="120" viewBox="-3 -3 120 120" >
<circle cx="50" cy="50" r="50" fill="#d3d3d3" stroke="black" stroke-width="3" />
<path d="m10 41.7h80l0.1 16.2H10Z" stroke="grey" stroke-width="3"/>
<path d="M41.5 10.7C41.2 5.6 58 7.2 58 10c0 14.5 0.1 32.7 0.1 32.7l0.3 47.2c0 2.6-16.3 3.4-16.3 0.3L41.9 57.9c0-9.8 0-39-0.4-47.2z" stroke="grey" stroke-width="3">
<animate id="minus" attributeName="d" begin="indefinite" dur="1" fill="freeze" values="
M 41.497579,10.712787 C 41.215184,5.5654865 57.976764,7.166333 57.976764,9.9637344 c 0,14.5316426 0.149811,32.6587446 0.149811,32.6587446 l 0.299621,47.19039 c 0.01681,2.646836 -16.314972,3.395911 -16.329373,0.299621 L 41.947012,57.903177 c 0,-9.787479 0,-38.998462 -0.449433,-47.19039 z;
m 10.03732,58.052988 c -2.7969215,-0.05179 -2.3470171,-15.803081 0.449434,-15.73013 17.228237,0.449432 43.361475,-0.509557 47.49001,-0.449433 l 30.861016,0.449433 c 2.64661,0.03854 3.995172,15.440245 0.898864,15.430508 L 42.096823,57.603555 C 26.167024,57.553462 18.127101,58.202799 10.03732,58.052988 Z"/>
<animate id="plus" attributeName="d" begin="indefinite" dur="1" fill="freeze" values="
m 10.03732,58.052988 c -2.7969215,-0.05179 -2.3470171,-15.803081 0.449434,-15.73013 17.228237,0.449432 43.361475,-0.509557 47.49001,-0.449433 l 30.861016,0.449433 c 2.64661,0.03854 3.995172,15.440245 0.898864,15.430508 L 42.096823,57.603555 C 26.167024,57.553462 18.127101,58.202799 10.03732,58.052988 Z;
M 41.497579,10.712787 C 41.215184,5.5654865 57.976764,7.166333 57.976764,9.9637344 c 0,14.5316426 0.149811,32.6587446 0.149811,32.6587446 l 0.299621,47.19039 c 0.01681,2.646836 -16.314972,3.395911 -16.329373,0.299621 L 41.947012,57.903177 c 0,-9.787479 0,-38.998462 -0.449433,-47.19039 z;
"/>
</path>
</svg>
<script>
var svg_1 = document.getElementById("svg1"),
minus = document.getElementById("minus"),
plus = document.getElementById("plus");
let flag = true;
svg_1.addEventListener('click', function() {
if (flag == true) {
minus.beginElement();
flag = false;
} else {
plus.beginElement();
flag = true;
}
});
</script>