JSFiddle - React, Tailwind, and code Playground

HTML

Get Star<input type="radio" name="getElement" value="1"/>
Get Square<input type="radio" name="getElement" value="2" />
Get Triangle<input type="radio" name="getElement" value="3" />

<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">
    <g id="test1" class="getThisElement" style="display:none">
       <path d="m118.81818,221.45453l-14.81818,21.54547l-26,1l23,20l-15,29l31,-32l21,27l-6,-27l19,-18l-26,-3l-6.18182,-18.54547z" stroke-linecap="null" stroke-linejoin="null" stroke-width="5" stroke="#000000" fill="#FF0000"/>
    </g>
    <g id="test2" class="getThisElement" style="display:none">
       <path d="m61.81818,38.45453l78.18182,-0.45453l0,57l-77,-1l-1.18182,-55.54547z" stroke-linecap="null" stroke-linejoin="null" stroke-width="5" stroke="#000000" fill="#FF0000"/>
    </g>
    <g id="test3" class="getThisElement" style="display:none">
       <path d="m110.81818,127.45453l-41.81818,68.54547l78,2l-36.18182,-70.54547z" stroke-linecap="null" stroke-linejoin="null" stroke-width="5" stroke="#000000" fill="#FF0000"/>
    </g>
</svg>

JavaScript

$(function() {
		$("[name=getElement]").click(function(){
				$('.getThisElement').hide();
				$("#test"+$(this).val()).show('fast');
		});
	 });