JSFiddle - React, Tailwind, and code Playground

HTML

<svg>
    <rect id="red"    x=10 y=10 width=60 height=60 style="fill:#ff0000" />
    <rect id="orange" x=80 y=10 width=60 height=60 style="fill:#ffcc00" />
    <rect id="blue"   x=50 y=30 width=60 height=60 style="fill:#0000ff; fill-opacity: 0.8" />
</svg>

<pre></pre>

CSS

pre {
    background: #ddd;
    border: 1px solid #ccc;
    height: 400px;
    overflow-y: scroll;
    padding: 10px 20px;
}

JavaScript

$('rect').on('mousemove', function()
{
    log(this.id);
});
function log(msg)
{
    $('pre').html(msg + '<br />' + $('pre').html());
    console.log(msg);
}