title: datatable plugin not working
body: <p>I am trying to use the DataTable plugin to add functionality to my html table. I followed the steps for installation and initialization from datatables.net, but it is not adding any functionality to my html page. I am wondering if it is because my table is formatted in a way that isn't supported by the plug-in. Any input would be useful. Thanks a lot!</p>
  
  <p>Here is my code:</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;{% load staticfiles %}
  &lt;link rel="stylesheet" type="text/css" href="//cdn.datatables.net/plug- ins/1.10.7/integration/bootstrap/3/dataTables.bo‌​otstrap.css" /&gt;
  &lt;link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" /&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"&gt; &lt;/script&gt;
  &lt;!-- DataTables CSS --&gt;
  &lt;!-- &lt;link rel="stylesheet" type="text/css" href="/DataTables- 1.10.7/media/css/jquery.dataTables1.css"&gt; --&gt;
  &lt;script type="text/javascript"&gt;
      $(document).ready(function() {
          $('#detailTable').DataTable();
      });
  &lt;/script&gt;
  &lt;!--&lt;link rel="stylesheet" type="text/css" href="{% static    'inventory/detailStyle.css' %}" /&gt;--&gt;
  
  &lt;h1&gt;{{ inventory.inventory_name }}&lt;/h1&gt;
  
  &lt;table cellpadding="1" cellspacing="1" id="detailTable"&gt;
      &lt;thead&gt;
          &lt;th&gt;NAME&lt;/th&gt;
          &lt;th&gt;STATUS&lt;/th&gt;
          &lt;th&gt;DERIVATIVES&lt;/th&gt;
          &lt;th&gt;SUBSYSTEMS&lt;/th&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;{% for block in inventory.block_set.all %}
          &lt;tr&gt;
              &lt;td&gt;{{ block.block_name }}&lt;/td&gt;
              &lt;td&gt;{{ block.block_status }}&lt;/td&gt;
              &lt;td&gt;{{ block.block_derivatives }}&lt;/td&gt;
              &lt;td&gt;{{ block.block_subsystems }}&lt;/td&gt;
          &lt;/tr&gt;{% endfor %}&lt;/tbody&gt;
  &lt;/table&gt;
  &lt;div&gt;   &lt;a href="{% url 'inventory:requests' inventory.id %}"&gt;Request  Form&lt;/a&gt;
  
  &lt;/div&gt;
  </code></pre>