$.fn.deferredLoad = function()
<div class="deferred-load" data-load="svg.svg"></div>
<object type="image/svg+xml" data="svg-source.svg">
<object type="image/svg+xml" data="svg-source.svg"></object>
According to this answer, using object is better practice anyway. Here is a decent blog post that recommends (for cross-browser compatibility):
I have no idea what's going on under the hood, but there is an easier solution, at least for inline SVG's (not sure about backgrounds). Change:
I have not tested this latter option, but if it works it is much simpler than this solution.
In addition, you need to make sure you have viewBox defined for the svg document.