Since: DataTables 1.10

Cell created callback to allow DOM manipulation.


This is a callback function that is executed whenever a cell is created (Ajax source, etc) or read from a DOM source. It can be used as a complement to columns.render allowing modification of the cell's DOM element (add background colour for example) when the element is created (cells may not be immediately created on table initialisation if deferRender is enabled, or if rows are dynamically added using the API (rows.add()).

This is the counterpart callback for rows, which use the createdRow option.


function createdCell( cell, cellData, rowData, rowIndex, colIndex )



Using createdCell manipulate the DOM with columnDefs:

new DataTable('#myTable', {
	columnDefs: [
			targets: 3,
			createdCell: function (td, cellData, rowData, row, col) {
				if (cellData < 1) {
					$(td).css('color', 'red');


The following options are directly related and may also be useful in your application development.