Issue with using jquery tablesorterPager

Issue with using jquery tablesorterPager

I am using jquery 1.7.2 and primefaces 3.3.1. The pagination is not getting displayed. Here is my code,

  1. <h:head>
  2.         <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery.tablesorter.min.js" />
  3.         <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery.tablesorter.pager.js" />
  4.         <script type="text/javascript" src="#{lookupBean.themePath}/js/jquery.simplemodal.1.4.2.min.js" />
  5.         <script type="text/javascript" src="#{lookupBean.themePath}/js/javascript.js" />
  6.             <script>
  7.                 jQuery('table[id$="affiliationTable"]').tablesorter(
  8.                 {
  9.                     sortList :
  10.                     [
  11.                     [ 3, 1 ] ],
  12.                     widgets :
  13.                     [ 'zebra' ]
  14.                 }).tablesorterPager(
  15.                 {
  16.                     container : jQuery("div#selectiveAuditPager"),
  17.                     size : 15,
  18.                     positionFixed : false,
  19.                     seperator : ' of '
  20.                 });
  21.             </script>
  22.  </h:head>
  23. <h:body>
  24.       <div id="tableContainer" class="tableContainer">
  25.                                 <table id="affiliationTable" class="tablesorter" width="100%">
  26.                                     <thead>
  27.                                     </thead>
  28.                                     <tbody>
  29.                                     </tbody>
  30.                                   </table>
  31.        </div>
  32.       <div id="selectiveAuditPager" class="pager" align="center"
  33.                                 style="width: 99%; border: 1px solid #CECECE; background-color: #E7EAF0; padding: 2px;">
  34.                                 <img src="#{lookupBean.themePath}/images/first.png" class="first" />&#160;&#160; <img
  35.                                     src="#{lookupBean.themePath}/images/prev.png" class="prev" />&#160;&#160; <input id="pagedisplay" type="text"
  36.                                     size="8" class="pagedisplay" disabled="true"
  37.                                     style="font-weight: bold; border: none; background-color: #E7EAF0;" />&#160;&#160; <img
  38.                                     src="#{lookupBean.themePath}/images/next.png" class="next" />&#160;&#160; <img
  39.                                     src="#{lookupBean.themePath}/images/last.png" class="last" /> <input type="hidden" class="pagesize" value="15" />
  40.                             </div>
  41. </h:body>

Please let me know what could be wrong here.