I know this is a easy fix, I'm doing something wrong... I've selected multiple tables and tried to use each for applying cornering to each table. Inside the callback function, I try to find the first/last table cells to apply cornering for each corner. However, when there are multiple tables it looks at _all_ the tr elements for the first/last rows. See example code:
// Add cornering to tables $('table.corner-me').addClass('ui-corner-all').each(function(){ var $table = $(this); $table.find('tr:first :first-child').addClass('ui-corner-tl'); $table.find('tr:first :last-child').addClass('ui-corner-tr'); $table.find('tr:last :first-child').addClass('ui-corner-bl'); $table.find('tr:last :last-child').addClass('ui-corner-br'); }); <table class="corner-me"> <tr> <th>Header 1</th> <th>Header 2</th> </tr> <tr> <td>Data A1</td> <td>Data B1</td> </tr> <tr> <td>Data A2</td> <td>Data B2</td> </tr> </table> <table class="corner-me"> <tr> <td>Data A1</td> <td>Data B1</td> </tr> <tr> <td>Data A2</td> <td>Data B2</td> </tr> <tr> <td>Data A3</td> <td>Data B3</td> </tr> </table>