<img src="https://image.flaticon.com/icons/svg/2328/2328513.svg">
body {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

svg, img {
  max-width: 100%;
}
const convertImages = (query, callback) => {
  const images = document.querySelectorAll(query);

  images.forEach(image => {
    fetch(image.src)
    .then(res => res.text())
    .then(data => {
      const parser = new DOMParser();
      const svg = parser.parseFromString(data, 'image/svg+xml').querySelector('svg');

      if (image.id) svg.id = image.id;
      if (image.className) svg.classList = image.classList;

      image.parentNode.replaceChild(svg, image);
    })
    .then(callback)
    .catch(error => console.error(error))
  });
}

convertImages('img');

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.