javascript - Cannot find where I have a popstate loop creating multiple history entries -

i'm trying create single webpage replaces content of main div when navigation links clicked. i've been able implement pushstate function replace div content , change url address pretty easily. able content refresh when back/forward buttons clicked popstate function. however, click first link , works fine, click next link , seems apply 2 pushstates, 3rd click, applies 3 pushstates, etc. seems there push loop occurring somewhere not sure is. in search of advice on how eliminate multiple pushstates occurring aren't duplicated in history.

html code:

<nav id="headernav">     <ul>         <li><button class="navbutton" id="signin" href="./content/signin.php" name="reply" title="signin">sign in</button></li>         <li><button class="navbutton" id="signup" href="./content/registration.php" name="registration" title="registration">sign up</button></li>         <li><button class="navbutton" id="about" href="./content/about.php" name="settings" title="about">about</button></li>     </ul>    </nav>      <section id="maincontent">     <!-- content pages replace here -->     <?php         include ('./content/start.php');     ?>  </section> 

javascript

$(document).ready(function() {      if (window.history && history.pushstate) {          $(".navbutton").click(function(e) {                 e.preventdefault();             $("#maincontent").fadeout().load($(this).attr("href")).fadein();             history.pushstate(null, $(this).attr("title"), $(this).attr("name"));         });     } });   window.addeventlistener('popstate', function() {     //when back/forward clicked checks url pathname determine content place in div     if (location.pathname == "/index.php") {         $("#maincontent").load("./content/start.php");     } else {         $("#maincontent").load("./content" + location.pathname + ".php");     } }); 

solved! "if" condition test history api. when removed eliminated repeated history pushes. have htaccess file redirecting typed in urls index page allows pathname comparison fire content. works great know i'll have address bookmarking if later site grows. now, functions way need can move forward!

window.onload = function() {     // pushes correct content depending on url path - ensures back/forward , bookmarks work     if (location.pathname == "/index2.php") {         $("#maincontent").load("./content/start.php");     } else {         $("#maincontent").load("./content" + location.pathname + ".php");     }      // handler detect click of navbutton class     $(".navbutton").click(function(e) {         $(this).addclass("active");         $(".navbutton").not(this).removeclass("active");         var $maincontent = $("#maincontent");         var $href = $(this).attr("href");         var $title = $(this).attr("title");         var $name = $(this).attr("name");          // replaces content dynamic transition         $maincontent.fadeout(100, function() {             $maincontent.load($href, function() {                 $maincontent.fadein(100);             });         });          //changes document title since pushstate can't yet         document.title = $title;          // pushes url change , history state browser         history.pushstate('', $title, $name);          //prevents default action of navbutton         e.preventdefault();     });      // event makes sure back/forward buttons work     window.onpopstate = function(event) {         if (location.pathname == "/index2.php") {             $("#maincontent").load("./content/start.php");         } else {             $("#maincontent").load("./content" + location.pathname + ".php");         }     }; };