                nextDataIndex = 0
             else
                nextDataIndex = currentDataIndex + 1
-            jquerySelector = self.dropDownItem + "[data-index='" + nextDataIndex + "']"
+               
+            jquerySelector = dropDownItemSelector + "[data-index='" + nextDataIndex + "']"
             $(this).blur()
             $(jquerySelector).focus()
             event.preventDefault()
-         else if (event.keyCode == 13 || event.keyCode == 9)
+         else if event.keyCode == 13 || event.keyCode == 9
             self.insertAutoCompleteItem($(this))
             event.preventDefault()
             $('trix-editor').focus()
           else
              self.autoCompleteEnd();
              $('trix-editor').focus()
-
-
-   #checkAutoComplete: (character, value) ->
-      #@strategies[@strategyIndex].search()
-      #if value.indexOf(character) >= 0
-         #return value
-      #else
-         #return

         .attr({'tabindex' : 0, 'data-index' : @numDropDownItems})
         .append(html)

         #'<li class = autoComplete-item tabindex = ' + 0 + ' data-index = ' + @numDropDownItems + '></li>'

      #$(container).append(html)
      temp = '<li class = autoComplete-item tabindex = ' + 0 + ' data-index = ' + @numDropDownItems + '></li>'
      @dropDown.append(container)
      @numDropDownItems++

   insertAutoCompleteItem: (dropDownItem) ->
      $(dropDownItem).addClass("active")
      strategyIndex = @strategyIndex
      startingPosition = @startingPosition
      endingPosition = @endingPosition

      if @currentStrategy.extract
         HTML = @strategies[@strategyIndex].extract(dropDownItem[0])
      else
         HTML = dropDownItem[0].innerText

      return unless HTML?
      return unless endingPosition >= startingPosition

      @editor.setSelectedRange([startingPosition, endingPosition + 1])
      @editor.deleteInDirection("forward")

      @strategies[strategyIndex].replace(HTML, startingPosition, startingPosition)

      @autoCompleteEnd()

   initEventListeners: ->
      self = this
      $(@dropDownItem + "[data-index='0']").focus()

      $(window).on 'resize', () ->
         self.positionDropDown()

      $(window).on 'mousedown', () ->
         self.autoCompleteEnd()

      $('trix-editor').on 'mousewheel', () ->
         self.autoCompleteEnd()

      $(@dropDownItem).on 'focus', () ->
         $(this).addClass('active')
      $(@dropDownItem).on 'blur', () ->
         $(this).removeClass('active')
      $(@dropDownItem).on 'hover',
         (() ->
            $(this).focus()
            $(this).addClass('active')),

            $(this).removeClass('active')
         )

      dropDownItemJQ.on 'mousedown', () ->
         self.insertAutoCompleteItem($(this))

      dropDownItemJQ.on 'keydown', (event) ->
         currentDataIndex = parseInt($(this).attr('data-index'))
         nextDataIndex = 0
         #jquerySelector = dropDownItemSelector + "[data-index='" + nextDataIndex + "']"

         if event.keyCode == 38
            if currentDataIndex == 0
               nextDataIndex = self.numDropDownItems - 1
            else
               nextDataIndex = currentDataIndex - 1

            jquerySelector = dropDownItemSelector + "[data-index='" + nextDataIndex + "']"
            $(this).blur()
            $(jquerySelector).focus()
            event.preventDefault()
