How can I get attribute value?

Question

I need to get the attribute value on <li>, I am using the following plugin:
Searchable Multi-select Dropdown Plugin With jQuery - Dropdown.js

How can I get the attribute value of each li when all changes to ul li?

Here is HTML:

<option value="D12320010">MV/LV Fault Recovery</option>
          <option value="2">a</option>
          <option value="3">a1</option>
          <option value="4">dfg</option>
          <option value="5">sdsdf</option>
          <option value="6">a8</option>

JS:

$('.demo').dropdown({
      multipleMode: 'label'
  })

HTML rendered after plugin changes my <option> to <li>

<div class="dropdown-main">
  <ul>
    <li tabindex="0" data-value="D12320010" class="dropdown-option ">MV/LV Fault Recovery</li>
    <li tabindex="0" data-value="2" class="dropdown-option ">a</li>
    <li tabindex="0" data-value="3" class="dropdown-option ">a1</li>
    <li tabindex="0" data-value="4" class="dropdown-option ">dfg</li>
    <li tabindex="0" data-value="5" class="dropdown-option ">sdsdf</li>
    <li tabindex="0" data-value="6" class="dropdown-option ">a8</li>
  </ul>
</div>

Thanks in advance

Answer 1

Use the choice callback option when initializing the dropdown:

$('.demo').dropdown({
    multipleMode: 'label',
    choice: function () {
        $('.demo').find(':selected').each(function( index ) {
          console.log( index + ": " + $( this ).text() );
        });
    }
});