Copy cell classes to responsive display

[DataTables]

Copy classes from the td / th cells to the li tag to maintain styling.

Moved from DataTables/DataTables #864.

[MichelleDiniz]

Hi, first thank you for the good work. Any news on this issue?

[als9xd]

Here is a workaround using events

HTML

<div class="container">
  <table class="dataTable table table-striped" id="example">
  </table>
</div>

CSS

td.customColumn{
  background-color:yellow;
}

.customColumn > .dtr-data{
  background-color:yellow;
}

Javascript

let dataSet = [
  ["Tiger Nixon", "System Architect", "Edinburgh", "5421", "$320,800"],
  ["Garrett Winters", "Accountant", "Tokyo", "8422","$170,750"],
  ["Ashton Cox", "Junior Technical Author", "San Francisco", "1562", "$86,000"],
  ["Cedric Kelly", "Senior Javascript Developer", "Edinburgh", "6224", "$433,060"],
];

let columnDefs = [{
    title: "Name"
  }, {
    title: "Position"
  }, {
    title: "Office"
  }, {
    title: "Extn.",
    className: "customColumn"
  }, {
    title: "Salary",
}];

let myTable = $('#example').DataTable({
  data: dataSet,
  columns: columnDefs,
  responsive: true,
}).on( 'responsive-display', function ( e, datatable, row, showHide, update ) {
  if(typeof row.selector.rows[0] !== 'undefined'){
    $(row.selector.rows[0].nextSibling).find('li[data-dt-column="3"]').addClass('customColumn');    
   }
}).on('responsive-resize',function( e, datatable, columns ){
  $(columns).find('li[data-dt-column="3"]').addClass('customColumn');
});

[AllanJard]

Can't recall when I committed the fix (and blame shows a newer commit), but [Responsive does indeed do this](https://github.com/DataTables/Responsive/blob/78abad26806853591efde2a55fe1e710e59d4ab6/js/dataTables.responsive.js#L1271.