# select()

Selects an item or a collection of items.

##### Syntax

    Selectable.select([items])

The method accepts a single argument in the following forms:

- `HTMLElement` - the selectable element you want to select.
- `Number` - the index of the selectable element (not it's index in the `parentNode`).
- `Object` - a reference to the `item` stored in the `items` array.
- `Array` - an array of nodes, indexes or objects. You may also pass instances of `HTMLCollection` or `NodeList`.

#### Selecting single items

###### Markup

    <ul>
        <li class="ul-selectable"></li>
        <li class="ul-selectable"></li>
        <li class="ul-selectable"></li>
        <li class="ul-selectable"></li>
        ...
    </ul>

###### Javascript

    // All three of these methods will select the first item

    // as a node
    var item = document.querySelectorAll("li")[0];
    selectable.select(item);

    // as an index
    selectable.select(0);

    // as a reference to the item
    var item = selectable.items[0];
    selectable.select(item);

#### Selecting multiple items

###### Markup

    <ul>
        <li class="ul-selectable">1</li>
        <li class="ul-selectable alt">2</li>
        <li class="ul-selectable">3</li>
        <li class="ul-selectable alt">4</li>
        <li class="ul-selectable">5</li>
        <li class="ul-selectable alt">6</li>
        <li class="ul-selectable">7</li>
        <li class="ul-selectable alt">8</li>
    </ul>

###### Javascript

    // Select the first 3 items via their indexes
    var items = [0,1,2];
    selectable.select(items);

    // select all items with className "alt"
    var items = document.querySelectorAll(".alt");
    selectable.select(items);

    // select all list items
    var items = document.querySelectorAll("li");
    selectable.select(items);

###### Result

### Using indexes

NOTE: If selecting an item via an index, you must pass the index as the node would appear in the collection of selectable items, NOT the node's position relative to it's sibling elements.

    <ul>
        <li class="ul-selectable">1</li> // index 0
        </li></li>
        </li></li>
        <li class="ul-selectable">2</li> // index 1
        <li class="ul-selectable">3</li> // index 2
        <li class="ul-selectable">4</li> // index 3
        </li></li>
        <li class="ul-selectable">5</li> // index 4
    </ul>

#### Select the first, second and third items

    // incorrect
    selectable.select([0,3,4]);

    // correct
    selectable.select([0,1,2]);