JSFiddle - React, Tailwind, and code Playground

HTML

<div id="myImgId" style="width: 200px; height: 200px; background:#000;" onmouseup="doSomething()" onmousedown="return false;">
</div>

<div id="svgOne"></div>

JavaScript

function doSomething()
  {	
var svgns = "http://www.w3.org/2000/svg";
  		var rect = document.createElementNS(svgns, 'rect');
        rect.setAttributeNS(null, 'x', '150');
        rect.setAttributeNS(null, 'y', '150');
        rect.setAttributeNS(null, 'height', '50');
        rect.setAttributeNS(null, 'width', '50');
        rect.setAttributeNS(null, 'fill', '#'+Math.round(0xffffff *         Math.random()).toString(16));
        document.getElementById('svgOne').appendChild(rect);
  
  }