Dropdown not working

[marcemira]

Hello, I'm trying to initialize a Dropdown like this:

<div class="language dropdown ch-shownby-pointertap ch-dropdown-trigger ch-user-no-select ch-dropdown-trigger-skin"
          data-title="Choose Language" 
          aria-haspopup="true"
          data-side="bottom" 
          data-align="left" 
          style="z-index: 1088;"> Choose language 
</div>

<div class="hidden langs-list">
    <ul>
        <li>En</li>
        <li>Es</li>
        <li>It</li>
        <li>Fr</li>
    </ul>
  </div>

(function(){

    var content = document.querySelector('.langs-list');
    var langDropdown = $('.language.dropdown').dropdown({

      skin: true,
      content: content

    });

  })();

The problem is that it doesn't show any content (according to Dropdown API Docs) and the console throws an error: Uncaught TypeError: Cannot read property 'cloneNode' of undefined on https://github.com/mercadolibre/chico/blob/master/src/shared/scripts/Dropdown.js#L179.

Am I doing something wrong? Thanks

[cmdelatorre]

+1 to this issue.

[atma]

Hi @marcemira, Currently content should be a jQuery object, you are passing an HTMLElement to the Dropdown. Just replace document.querySelector with var content = $('.langs-list') and let me know is that works.

[cmdelatorre]

Passing a jQuery object works fine. Thanks @atma