Mirroring a HTML table with Javascript/jQuery

Question

I'm trying to mirror a table, with a dynamic grid like 4x4, 7x7, or 9x2.

I dynamically create this:

<table id="mainTable" class="mainClassTable" border="0" cellpadding="0" cellspacing="0">
 <tbody>
  <tr id="row-1">
    <td id="col-1" onclick="imgClick(this)">Stuff Here</td>
    <td id="col-2" onclick="imgClick(this)">Stuff Here</td>
    <td id="col-3" onclick="imgClick(this)">Stuff Here</td>
    <td id="col-4" onclick="imgClick(this)">Stuff Here</td>
  </tr>
  <tr id="row-2">
   <td id="col-1" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-2" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-3" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-4" onclick="imgClick(this)">Stuff Here</td>
  </tr>
  <tr id="row-3">
   <td id="col-1" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-2" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-3" onclick="imgClick(this)">Stuff Here</td>
   <td id="col-4" onclick="imgClick(this)">Stuff Here</td>
  </tr>
 </tbody>
</table>

I'm wondering what would be the best way for each row to get col-1 to move to col-4, and col-2 on col-3. And with uneven columns I fear it would be more complicated.

I found something about shuffling rows, but I want to shuffle columns.

I'm thinking about using jQuery selectors to tediously repositioning each td, but i'm wondering if there might be a nice jquery plugin to rearrange tables.

I don't want draggable, I just want one click to mirror the table (not the contents).

/Edit
So I tried making each col ID unique, but I ended up with this steaming pile of code:

function makeGrid(content, rowCount, colCount)
{   
//Empty TD string
tableVarSet = "";
//gridTotal = gridTotal - gridTotal;
//Loop for multiple columns
for (c=1;c<=colCount;c++)
    {
    //make column var
    tableVarSet = tableVarSet + makeColumns(content, c);
    }

//Loop for multiple rows
for (i=1;i<=rowCount;i++)
{
//Make new Row
    rowVarToAdd = "<tr id=TMPR>"+tableVarSet+"</tr>";

    $("#mainTable").append(rowVarToAdd);  
//Set new RowID
    rowName = "row-" + i;
    $("#TMPR").attr('id', rowName);

}
};

function makeColumns(content, count)
{

//Split String
tableVar1 = "<td id=col-"
tableNum = count;
tableVar2 = " onClick='imgClick(";
tableFunction = "this" ;
tableVar3 = ")'>"+content+"</td>";

//Combine Strings:
colVar = tableVar1 + tableNum + tableVar2 + tableFunction + tableVar3;
//Return result
return colVar;
};

So, yeah it kind of works but It can probably be a lot easier. (any ideas?)