Class: DataTable

   $(document).ready(function() {
     var oTable = $('#example').dataTable();

     // Highlight every second row
     oTable.$('tr:odd').css('backgroundColor', 'blue');
   } );

 

   $(document).ready(function() {
     var oTable = $('#example').dataTable();

     // Filter to rows with 'Webkit' in them, add a background colour and then
     // remove the filter, thus highlighting the 'Webkit' rows only.
     oTable.fnFilter('Webkit');
     oTable.$('tr', {"filter": "applied"}).css('backgroundColor', 'blue');
     oTable.fnFilter('');
   } );

   // Global var for counter
   var giCount = 2;
   
   $(document).ready(function() {
     $('#example').dataTable();
   } );
   
   function fnClickAddRow() {
     $('#example').dataTable().fnAddData( [
       giCount+".1",
       giCount+".2",
       giCount+".3",
       giCount+".4" ]
     );
       
     giCount++;
   }

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     
     // Immediately 'nuke' the current rows (perhaps waiting for an Ajax callback...)
     oTable.fnClearTable();
   } );

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     
     // Immediately remove the first row
     oTable.fnDeleteRow( 0 );
   } );

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     
     // Re-draw the table - you wouldn't want to do it here, but it's an example :-)
     oTable.fnDraw();
   } );

   // Row data
   $(document).ready(function() {
     oTable = $('#example').dataTable();

     oTable.$('tr').click( function () {
       var data = oTable.fnGetData( this );
       // ... do something with the array / object of data for the row
     } );
   } );

 

   // Individual cell data
   $(document).ready(function() {
     oTable = $('#example').dataTable();

     oTable.$('td').click( function () {
       var sData = oTable.fnGetData( this );
       alert( 'The cell clicked on had the value of '+sData );
     } );
   } );

   $(document).ready(function() {
     $('#example tbody td').click( function () {
       // Get the position of the current data from the node
       var aPos = oTable.fnGetPosition( this );
       
       // Get the data array for this row
       var aData = oTable.fnGetData( aPos[0] );
       
       // Update the data array and return the value
       aData[ aPos[1] ] = 'clicked';
       this.innerHTML = 'clicked';
     } );
     
     // Init DataTables
     oTable = $('#example').dataTable();
   } );

   $(document).ready(function() {
     var oTable;
     
     // 'open' an information row when a row is clicked on
     $('#example tbody tr').click( function () {
       if ( oTable.fnIsOpen(this) ) {
         oTable.fnClose( this );
       } else {
         oTable.fnOpen( this, "Temporary row opened", "info_row" );
       }
     } );
     
     oTable = $('#example').dataTable();
   } );

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     
     // Hide the second column after initialisation
     oTable.fnSetColumnVis( 1, false );
   } );

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     
     // Sort immediately with columns 0 and 1
     oTable.fnSort( [ [0,'asc'], [1,'asc'] ] );
   } );

   $(document).ready(function() {
     var oTable = $('#example').dataTable();
     oTable.fnUpdate( 'Example update', 0, 0 ); // Single cell
     oTable.fnUpdate( ['a', 'b', 'c', 'd', 'e'], 1, 0 ); // Row
   } );

   var ex = document.getElementById('example');
   if ( ! $.fn.DataTable.fnIsDataTable( ex ) ) {
     $(ex).dataTable();
   }

   alert( $.fn.dataTable.fnVersionCheck( '1.9.0' ) );