Header Groups enhancement Issue #23

Updated the sortable plugin to handle th's and td's.
Updated the core to apply the class 'footable-first-column' to the first
visible th or td in every row as once the first column was hidden the
:first-child selector no longer worked correctly.

Added in support for header groups:

To accommodate this I added in a new attribute called 'data-group' which
allows you to assign your main/sortable header row cells to their header
groups, by doing this the core plugin manages when to display the header
groups and assigns the correct colspan to them thus maintaining layout.

To aid with selection the row containing the header groups needs to have
the class 'footable-group-row' applied to it.

Example HTML:

```html

<table class="footable">
<thead>
<tr class="footable-group-row">
<th data-group="group1" colspan="2">Group 1</th>
<th data-group="group2" colspan="3">Group 2</th>
</tr>
<tr>
<th data-group="group1">First Name</th>
<th data-group="group1">Last Name</th>
<th data-group="group2" data-hide="phone">Job Title</th>
<th data-group="group2" data-hide="phone">DOB</th>
<th data-group="group2" data-hide="phone,tablet">Status</th>
</tr>
</thead>
...
</table>

```

Looking at the above HTML snippet on a tablet the 'Status' column would
be hidden, as this is linked to the group header "Group 2" via the
'data-group="group2"' attribute the group header will have it's colspan
adjusted to 2 but it will remain visible. When viewed on a phone though
the 'Job Title', 'DOB' and 'Status' columns are all hidden so the "Group
2" header will be hidden as well.