SVG ignore hover, how to make it work?

Question

SVG

We have an SVG with a color change on hover -
.str0:hover { stroke:red; fill: blue }
If this SVG is inserted into the page, then everything works. However, if it is used as an img image - <img src="img/class-offline.svg">- then the hover will not work. Any attempt to change the CSS of this image with javaScript also fails.
What to do?

Answer 1

Svg in img will not respond to hover. inserted as a normal image. For interaction, you need to insert the svg itself.