Basic jQuery SVG Wrapper Class Taken From My HomeMarks Project

my.css

#my-logo-text { position: absolute; width: 220px; height: 60px; top: 46px; left: 85px; }
#my-logo-text svg { width: inherit; height: inherit; }
#my-logo-text-text path     { fill: white; }
#my-logo-text-tag-line path { fill: white; }

svg.coffee

$ = jQuery

$.fn.mySVG = -> $(@).data 'my-svg'
$.fn.mySVGSet = (svg) -> $(@).data 'my-svg', svg

class window.MyNamespace.Models.SVG

  constructor: (@wrapperID, @loadURL, @options={}) ->
    @el = $(@wrapperID)
    if @el.length
      @el.svg loadURL: @loadURL, onLoad: @onLoad
      @el.mySVGSet @
  
  find: (selector) ->
    $ selector, @root

  # Private (events)
  
  onLoad: (svg) =>
    @jq = svg
    @root = svg.root()
    @setRootAttributes()
    @svgDidLoad()

  # Private

  setRootAttributes: ->
    return unless @options.rootAttributes
    for own attr, value of @options.rootAttributes
      @root.setAttribute attr, value

  svgDidLoad: ->
    undefined


class MyLogoText extends MyNamespace.Models.SVG

  constructor: ->
    wrapperID = '#my-logo-text'
    loadURL   = '/assets/my-logo-text.svg'
    options   = rootAttributes: {viewBox: '0 0 600 160', x: '0px', y: '0px', width: '100%', height: '100%'}
    super wrapperID, loadURL, options

  svgDidLoad: ->
    @find('g title:contains(Text)').parent('g').attr    'id', 'my-logo-text-text'
    @find('g title:contains(TagLine)').parent('g').attr 'id', 'my-logo-text-tag-line'
    @find('g title:contains(Heart)').parent('g').attr   'id', 'my-logo-text-heart'


$ ->
  new MyLogoText

For full context, read this thread on the 757rb Google Group:
Using SVGs For The High Resolution Web