audio on the fly doesn't fire events correctly

audiopreloader.coffee

class Module
_.extend Module::, Backbone.Events

class AudioPreloader extends Module
  
  constructor: (options) ->

    @options = options
    @playableSrc = @_detectPlayableSrc()

  _detectPlayableSrc: ->
    playableSrc = null
    for src in @options.srcs
      ext = src.match(/[^.]+$/)
      switch ext[0]
        when 'mp3'
          if Modernizr.audio.mp3
            playableSrc = src
        when 'ogg'
          if Modernizr.audio.ogg
            playableSrc = src
      if playableSrc? then break
    playableSrc

  _createEl: ->
    el = document.createElement 'audio'
    #el.style.display = 'none'
    #el.style.position = 'absolute'
    #el.style.left = '-1000px'
    #el.src = @playableSrc
    #$('body').append el
    tellReady = =>
      el.removeEventListener 'canplaythrough', tellReady , false
      console.log 'canplaythrough'
      @trigger 'ready', @el
    el.addEventListener 'canplaythrough', tellReady , false
    el

  load: ->
    @el = @_createEl()
    @

$ ->

  #$('audio').eq(0).on 'canplaythrough', ->
  #  console.log 'go on!'

  m = new AudioPreloader
    srcs: ['media/sample.mp3', 'media/sample.ogg']
  m.on 'ready', (el) ->
    el.controls = true
    #$('#placer').append el
  m.load()