ordering changes after using render on column?

The 8th column in my dt is a timestamp column and I am using this as the default order as so :

"order": [[8,'desc']]

An example of the output in this column correctly shows in descending order.

2014-04-01 20:05:00
2014-04-01 16:27:00
2014-04-01 12:27:00
2014-04-01 09:28:00
2014-03-31 20:13:00
2014-03-31 18:41:00
2014-03-31 14:13:00

Now, if I render this column to show a more user friendly output with :

{
    "render": function ( data, type, row ) {
    	if (data == '')
    	{
    		return 'n/a';
    	}
    	else return $.format.date(data, 'MMMM D, yyyy @ h:mm a');
    }				
}

the output in my table becomes :

March 31st, 2014 @ 8:13 PM
March 31st, 2014 @ 6:41 PM
March 31st, 2014 @ 2:13 PM
April 1st, 2014 @ 9:28 AM
April 1st, 2014 @ 8:05 PM
April 1st, 2014 @ 4:27 PM
April 1st, 2014 @ 12:27 PM

which is no longer in the same order. Shouldn't ordering stay the same (using the default data shown above) regardless of what rendering I apply to it? Is there any way I can correctly order these rendered dates?

This particular table is using dom elements (whereas all my others user server-side)... is that the reason why ordering is behaving in this manner? The reason I am using dom is because I could not sort non-database values I was inserting into the table.