JSFiddle - React, Tailwind, and code Playground

by winnythepooh1

HTML

<script src="http://keith-wood.name/js/jquery.svg.js"></script>
<script src="http://keith-wood.name/js/jquery.svgdom.js"></script>
<svg
  version="1.1"
  xmlns="http://www.w3.org/2000/svg"
  width="400"
  height="400">
  <g>
    <rect id="jimmy" id="p5" x="200" y="200" width="100" height="100" />
  </g>
</svg>

CSS

svg {
  border: 1px solid #ddd;
  margin: 10px;
  padding: 0;
}

.clicked {
    stroke-width: 5;
    stroke: rgb(255,255,0)
}

JavaScript

$("#jimmy").click(function() {
    $(this).addClass("clicked");
    console.log('Classes:', this.className.baseVal);
});