I wrote this jquery to basically dynamically build a paging control for long articles, etc.... I have it dynamically generating a UL, a page selector and a drop down selector and I just need to write a piece that will do a <-Prev and Next -> and my brain is having trouble with it. Here is the code in simplified form. I also don't have the coding for the contect highlighting done yet to show what page we are on.
HTML: <div id="headerUL"><!--UL goes here--></div> <div id="page1" class="page" title="Section 1">This is Page 1</div> <div id="page2" class="page" title="Section 2">This is Page 2</div> <div id="page3" class="page" title="Section 3">This is Page 3</div> <div id="page4" class="page" title="Section 4">This is Page 4</div> <div id="prev"><!--This will be the Prev Link--></div> <div id="PageNum"><!-- Page Numbers 1, 2, 3, 4--></div> <div id="next"><!--This will be the Next Link--></div> <div id="DropDown"><!--Drop down box--></div> Here is the Jquery I have that generates it. I just need some help getting Prev and Next done. <script> $(document).ready(function(){ //Prestate $(".page:not(:first)").hide(); $(".page:first").show(); //Let's get the # of pages. var numPages = $(".page").length; var pageNums= ""; var prev = "", next=""; var i = 1; var lister = "<UL id=pageUL>"; var selector = "<select id=pageSelect>"; $(".page").each(function(i) { pageNums+= "<a href=# id="+this.id+" class=pageids>"+(i+1)+",</ a> " lister+="<LI><a href=# class=pageLI>"+$("#"+this.id).attr('title') +"</ a></LI>" selector+="<option class=pageSE value="+$("#"+this.id).attr('title') +">"+$("#"+this.id).attr('title')+"</option>" }); lister+="</UL>"; selector+="</select>"; //Add the Click events $(".pageids").live("click", function(){ $("#"+this.id).show(); $(".page:not(#"+this.id+")").hide(); }); $(".pageLI").live("click",function(){ var ht = $(this).html() $(".page").hide(); $("DIV[title='"+ht+"']").show(); }); $(".pageSE").live('click',function(){ var ht = $(this).text(); $(".page").hide(); $("DIV[title='"+ht+"']").show(); }); //Set the values $("#PageNum").html(pageNums); $("#headerUL").html(lister); $("#DropDown").html(selector); }); </script> Thanks in advance.