JSFiddle - React, Tailwind, and code Playground

by Gowtham Reddy

HTML

<html>
<body>

<svg	width="400" height="300">
 <g class="big">
<circle cx="100" cy="100" r="80" style="fill:lightgrey"></circle>
</g>
<g class="medium">
  <circle cx="100" cy="100" r="60"  style="fill:white"></circle>
  </g>
  <g>
  	<circle cx="100" cy="100" r="50" style="fill:lightblue">	
    </circle>
    </g>
    <g class="chota" onclick="chotaCircle()">
    <circle cx="100" cy="100" r="10"/>
    </g>
</body>
</html>

CSS

.chota {
  cursor: pointer;
   stroke: #333;
   stroke-width: 1px;
   fill: red;
   padding: 10px;
}

JavaScript

function chotaCircle(){
document.getElementById('chotaCircle').style.color = "yellow";
}