JSFiddle - React, Tailwind, and code Playground

HTML

<svg width="400" height="200" version="1.1"
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink">
	<image xlink:href="https://r.hswstatic.com/w_907/gif/tesla-cat.jpg" x="0" y="0" height="200px" width="400px" class="image"/>
</svg>

<button class="change">
Change image
</button>

JavaScript

let element = document.querySelector('.change');

element.addEventListener( "click" , function(){

	let value	= "https://i.ytimg.com/vi/YCaGYUIfdy4/maxresdefault.jpg";

  document.querySelector(".image").setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', value);
});