Selection buttons

Script to support a specific design of radio buttons and checkboxes wrapped in `<label>` tags:

    <label>
      <input type="radio" name="size" value="medium" />
    </label>

The script allows the label styling to reflect the state of the input inside because changes in state cause classes to be added or removed from the parent label. This makes the following styling possible:

Normal state:

![image](https://cloud.githubusercontent.com/assets/87140/3718395/cb348332-1635-11e4-8a27-2bcfd8881c2f.png)

Focused state:

![image](https://cloud.githubusercontent.com/assets/87140/3718403/d6274e6e-1635-11e4-829c-4dcbeb1cc50d.png)

Focused and selected state:

![image](https://cloud.githubusercontent.com/assets/87140/3718409/e3e4e4bc-1635-11e4-8c27-b7a62bf5e7ed.png)

A test page is available in the Gist to see the script working in-place. It requires your placing the `selection-buttons.js` script in the same folder as the page.

https://gist.github.com/tombye/4875fb3ace4f67dfe654
Does also listening for a `change` event cause problems here? As it would be really good if this could be merged with the radio button method. As it stands that is the only difference I can see (other than the radio version using an extra variable this doesn't).