我一直得到＆＃34; Uncaught TypeError：$（...）。DataTable不是一个函数＆＃34;

Question

        Below  JSP file  load  fine on  Chrome Browser.....but my table columns  never got sorted.

当我在Chrome上检查网络时...我看到了VM1475：2未捕获的TypeError：$（...）。DataTable不是一个函数。我重新安排了我的脚本，确保jquery首先加载但仍然面对同样的问题有人可以帮忙吗？我的代码如下所示

        <%@ taglib uri="http://jakarta.apache.org/struts/tags-logic-1.0" prefix="logic" %>
        <%@ taglib uri="http://jakarta.apache.org/struts/tags-bean-1.0" prefix="bean" %>
        <%@ page import="com.twp.charm.busobj.Deal"%>
        <%@ page import="com.twp.charm.busobj.Employee" %>
        <%@ page import="com.twp.charm.busobj.search.MultiSetSearchResult" %>
        <%@ page import="com.twp.util.DateUtil" %>
        <%@ page import="com.twp.util.StringUtil"%>
        <%@ page import="com.twp.charm.dataaccess.DealDataAccess" %>
        <%@ page import="com.twp.charm.util.Alternator" %>


        <%
            Employee user = (Employee) request.getSession().getAttribute("user");
            Deal deal = (Deal) request.getAttribute("deal");

            Object dealId = request.getParameter("id");
            if(deal == null && dealId != null)
            {
              deal = DealDataAccess.getDeal(Integer.parseInt((String) dealId));
            }

            String id = request.getParameter("id");
            MultiSetSearchResult dealPayments = user.getDealPayments(new Integer(id));
            Alternator ca = new Alternator("even", "odd");

        %>
      --------------------Added  Jquery and  Datatables Scripts here---
        <script type="text/javascript" src="/includes/jquery/jquery-3.1.0.min.js"></script>
        <link rel="stylesheet" type="text/css"href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.css">
        <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>


        <script type="text/javascript">
            $(document).ready( function () {
                $('#notSoCoolGrid').DataTable();
            } );

        </script>


        <script language="JavaScript" type="text/javascript">
            window.defaultStatus="<%= StringUtil.pluralize("deal payment", "", "s", dealPayments.getTotalResultCount().intValue(), true) %> for <%=deal.getCompanyName()%>";
        </script>
        <div class="subNav full">&nbsp;</div>

--------------table   Elements-------------------
        <table id="notSoCoolGrid" class="notSoCoolGrid sortable  larger" cellSpacing="0" cellPadding="2" borderStyle="2" >
            <thead>
                <tr>
                    <td>Type</td>
                    <td>Amt (K)</td>
                    <td>Invoiced Date</td>
                    <td>Received Date</td>
                    <td>Comments</td>
                </tr>
            </thead>
            <tbody>
                <logic:iterate id="thisPayment" collection="<%= dealPayments.getResults() %>" type="com.twp.charm.busobj.DealPayment">
                    <tr class="<%=ca.getNext()%>">
                        <td><bean:write name="thisPayment" property="paymentType" /></td>
                        <td><%= StringUtil.formatCurrency(thisPayment.getValue(), thisPayment.getCurrencyID())%></td>
                        <td><%= DateUtil.dateToString(thisPayment.getInvoiceDate()) %></td>
                        <td><%= DateUtil.dateToString(thisPayment.getReceiveDate()) %></td>
                        <td><%= thisPayment.getComments() %></td>
                    </tr>
                </logic:iterate>
            </tbody>
        </table>