I have four jquery tabs, each containing a different datatable. For some reason that I can not identify, the paging and search from the third tab is showing up at the bottom of the first tab (see attached image). This portion of the datatable also appears correctly on the third tab as expected. Any help would be appreciated.

       <div id="tabs-1">
            <ul>
                <li><a id="lys" href="#unprocessedDiv" >Unprocessed</a></li>
                <li><a id="lys3" href="#processedDiv" >Processed</a></li>
                <li><a id="prpscts" href="#getprospects" >Prospects</a></li>
                <li><a id="lys2" href="#Leaderboard" >Leaderboard</a></li>
            </ul>

            <div id="unprocessedDiv">
                <table id="unprocessed" width="500" border="0">
                    <thead id="tblhead">
                        <tr>
                            <th class="dthead" scope="col">Advertiser</th>
                            <th class="dthead" scope="col">Account</th>
                            <th class="dthead"  scope="col">Location</th>
                            <th class="dthead"  scope="col">Rep</th>
                            <th class="dthead"  scope="col">Entered</th>
                            <th class="dthead"  scope="col">Ad No.</th>
                            <th class="dthead"  scope="col">Processed</th>
                        </tr> 
                    </thead>
                    <tbody id="tblbody"></tbody>
                </table>
            </div>

            <div id="processedDiv">
                <table id="processed" width="500" border="0">
                    <thead id="tblhead">
                        <tr>
                            <th class="dthead" scope="col">Advertiser</th>
                            <th class="dthead" scope="col">Account</th>
                            <th class="dthead"  scope="col">Location</th>
                            <th class="dthead"  scope="col">Rep</th>
                            <th class="dthead"  scope="col">Entered</th>
                            <th class="dthead"  scope="col">Ad No.</th>
                            <th class="dthead"  scope="col">Processed</th>
                        </tr> 
                    </thead>
                    <tbody id="tblbody"></tbody>
                </table>
            </div>


            <div id="Prospects" class="hideit">
                <table id="getprospects" width="500" border="0">
                    <thead id="tblhead2">
                        <tr>
                            <th>Rep</th>
                            <th>Prospect</th>
                            <th>Phone</th>
                            <th>SubCategory</th>
                            <th>Rank</th>
                        </tr>
                    </thead>
                    <tbody id="tblbody2"></tbody>
                </table>
            </div>

            <div id="Leaderboard">
                <select name ="leaderboardSelect" class= "forminput11 clearable  c1" id ="leaderboardSelect"  ></select>
                <input type="button" name="getLeader" id="getLeader" value="Get Leader">
                <table id="getleader" width="500" border="0">
                    <thead>
                        <tr>
                            <th width="75px" align="left">Property</th>
                            <th width="75px"  align="left">Sales Rep</th>
                            <th width="75px"  align="left">Sales</th>

                        </tr>
                    </thead>
                    <tbody style="
                           background-color: white;
                           font-size: 12px;
                           text-align: left;
                           " id="tblbody3"></tbody>
                </table>
            </div>