title: Show hidden columns in dataTables when check a checkbox
body: <p>I'm trying to show columns hidden in the dataTable. I wrote my code as I understand from dataTables documentation, but it didn't work.</p>
  
  <pre><code>var $dtable = $('#example');
                var dtable  = $dtable.DataTable({
                    "scrollX": true,
                    "info":     false,
                    "dom": 'Bfrtip',
                    "columns": [
                          {"data": "name", className: 'profile', visible: true},
                          {"data": "position", className: 'sensitive', visible: false},
                          {"data": "office", className: 'profile', visible: true},
                          {"data": "age", className: 'sensitive', visible: false},
                          {"data": "startdate", className: 'profile', visible: true},
                          {"data": "salary", className: 'sensitive', visible: false}
                    ],
                    "buttons": [
                          'csv'
                    ]
                });
  
                $('.rect-check input').change(function(e){
                    console.log($(this).data('column'))
  
                    // Get the column API object
                    var column = $dtable.DataTable().column($(this).data('column'));
  
                    // Toggle the visibility
                    column.visible(true);
                })
  </code></pre>
  
  <p>the HTML</p>
  
  <pre><code>&lt;div class="rect-check"&gt;
    &lt;input data-column="sensitive" type="checkbox"&gt; Show sensitive
  &lt;/div&gt;
  
  &lt;table width="100%" class="display" id="example" cellspacing="0"&gt;
  ....
  </code></pre>
  
  <p>check full example on <a href="https://codepen.io/fayekramzy/pen/WEZGOv" rel="nofollow noreferrer">codepen</a> </p>