<!DOCTYPE html>
<html>
  <head>
    <link href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <link href="//datatables.net/download/build/dataTables.colReorder.nightly.css" rel="stylesheet" type="text/css" />
    <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
    <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>
    <script src="//datatables.net/download/build/dataTables.colReorder.nightly.js"></script>
    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <table id="example" class="display" width="100%">
      <thead>
        <tr>
          <th>Name</th>                     
          <th>Age</th>                      
        </tr>
      </thead>
      <tfoot>
        <tr>
          <th>Name</th>                     
          <th>Age</th>                      
        </tr>
      </tfoot>
      <tbody>
        <tr>
          <td data-order="2">Tiger Nixon</td>                       
          <td><span class="age">27</span></td>                      
        </tr>                   
        <tr>                        
          <td data-order="1">New York</td>
          <td><span class="age">45</span></td>                      
        </tr>
      </tbody>
    </table>
  </body>
</html>
 
.sorting_asc,
.sorting_desc {
  background-color: red !important;
}
 
$(document).ready(function () {
  
  var $table = $('#example').dataTable({
    dom: "<'H'Rlfr>t<'F'ipC>",
    jQueryUI: true
  });
});
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers