SVG Fallbacks to create Retina ready designs without much hassle. From http://css-tricks.com/svg-fallbacks/

SVGFallback

If you're using SVG as a background-image...
--------------------

CSS:

.my-element {
  background-image: url(image.svg);
}
.no-svg .my-element {
  background-image: url(image.png);
}

--------------------
If you're using SVG as <img>...
--------------------

HTML:
<img src="image.svg" onerror="this.src=image.png">

--------------------
That requires HTML though, so if that's not possible or practical for you, you could swap sources with Modernizr. This uses the JS API of Modernizr, not the class names:
--------------------

JS:
if (!Modernizr.svg) {
  $("img[src$='.svg']")
    .attr("src", fallback);
}

--------------------
Where fallback is a string of a URL where the non-SVG image fallback is. You could keep it in a data-fallback, use a consistent URL pattern where it just replaces .svg with .png, or whatever other smart thing you can think of.