selected/selected.js
function(option, selected) {
            var item = document.createElement('li');
            item.textContent = option.textContent;

            var activate = function() {
                // If multiple we just remove this option from the list
                if (multiple) {
                    item.style.display = 'none';

                // If single ensure no other options are selected, but keep in the list
                } else {
                    for (var i=0; i<options.length; i++) {
                        if (options[i]._deselected)
                            options[i]._deselected.classList.remove('active');
                    }
                }

                item.classList.add('active');

            }

            item.addEventListener('click', function(ev) {
                activate();
                selectOption(option); // create "selected" option
            });

            if (selected) {
                activate();
            }

            optionsList.appendChild(item);
            option._deselected = item;
        }
function(option, selected) {
            var item = document.createElement('li');
            item.textContent = option.textContent;

            var activate = function() {
                // If multiple we just remove this option from the list
                if (multiple) {
                    item.style.display = 'none';

                // If single ensure no other options are selected, but keep in the list
                } else {
                    for (var i=0; i<options.length; i++) {
                        if (options[i]._deselected)
                            options[i]._deselected.classList.remove('active');
                    }
                }

                item.classList.add('active');

            }

            item.addEventListener('click', function(ev) {
                activate();
                selectOption(option); // create "selected" option
            });

            if (selected) {
                activate();
            }

            optionsList.appendChild(item);
            option._deselected = item;
        }
function ( option , selected ) { var item = document . createElement ( 'li' ) ; item . textContent = option . textContent ; var activate = function ( ) { // If multiple we just remove this option from the list if ( multiple ) { item . style . display = 'none' ; // If single ensure no other options are selected, but keep in the list } else { for ( var i = 0 ; i < options . length ; i ++ ) { if ( options [ i ] . _deselected ) options [ i ] . _deselected . classList . remove ( 'active' ) ; } } item . classList . add ( 'active' ) ; } item . addEventListener ( 'click' , function ( ev ) { activate ( ) ; selectOption ( option ) ; // create "selected" option } ) ; if ( selected ) { activate ( ) ; } optionsList . appendChild ( item ) ; option . _deselected = item ; }
Create "deselected" option this is here because we _always_ have a full list of items in the optionList basically this means when we deselect something, it will always return to the original list position, rather than appending to the end
Create deselected option this is here because we _always_ have a full list of items in the optionList basically this means when we deselect something it will always return to the original list position rather than appending to the end