htmlcssdatatables

How to change the color of the sorting arrows in DataTables?

I am using DataTables and I need to change the color of the sorting arrows from the default (purplish) to something else. Code that I am trying is changing the entire header row color while I need just the icons.

Is there any other class because the below code is not helping me.

CSS

table.dataTable thead .sorting, 
table.dataTable thead .sorting_asc, 
table.dataTable thead .sorting_desc {
   color : yellow;
}

Thanks.

Solution

  • I figured it out. DataTables is using images for the icons so we cannot just change the color on fly. In order to do that we need to replace the icon images with the color of our choice. So in the below CSS, I simply replace the image from the DataTables with the one I needed. 

    table.dataTable thead .sorting_asc {
background-image: url("../images/integration/upArrow.gif");
}