Javascript-форум - Поиск элементов на странице

Добрый день. есть следующая страница, и скрипт в конце страницы

<!DOCTYPE html>
<html>
<head>
  <title>title</title>
</head>
<body>

<div class="menu">
  <ul>
    <li>
      <a href="/" class="load_page active">Home</a>
    </li>
    <li>
      <a href="/page1.php" class="load_page">link1</a>
    </li>
    <li>
      <a href="/page2.php" class="load_page">link2</a>
    </li>
    <li>
      <a href="/page3.php" class="load_page">link3</a>
    </li>
    <li>
      <a href="/page4.php" class="load_page">link4</a>
    </li>
  </ul>
</div>

<div class="content">home page</div>

<script src="/js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
  
  $('.load_page').on('click', function(){
    var link = $(this).attr("href");
    var title = $(this).attr("title");
    $('title').text(title);
    $(".menu>ul>li>a").removeClass("active");
    $(this).addClass('active');
    
    $(".content").load(link,
      {
        param1: "param1"
      },
      function(){
        var redirect = link;
        history.pushState('', '', redirect);
      }
    );
    return false;

  });

</script>

</body>
</html>

Содержимое страниц page1.php, page2.php и т.д. следующее

<?php if ($_POST["param1"] != "param1") { ?>
<!DOCTYPE html>
<html>
<head>
  <title>link1</title>
</head>
<body>

<div class="menu">
  <ul>
    <li>
      <a href="/" class="load_page" title="Home">Home</a>
    </li>
    <li>
      <a href="/page1.php" class="load_page active" title="link1">link1</a>
    </li>
    <li>
      <a href="/page2.php" class="load_page" title="link2">link2</a>
    </li>
    <li>
      <a href="/page3.php" class="load_page" title="link3">link3</a>
    </li>
    <li>
      <a href="/page4.php" class="load_page" title="link4">link4</a>
    </li>
  </ul>
</div>
<?php } ?>


<div class="content">
<h1>link1 page</h1>
  <ul>
    <li>
      <a href="/page5.php" class="load_page" title="link5">link5</a>
    </li>
    <li>
      <a href="/page6.php" class="load_page" title="link6">link6</a>
    </li>
    <li>
      <a href="/page7.php" class="load_page" title="link7">link7</a>
    </li>
    <li>
      <a href="/page8.php" class="load_page" title="link8">link8</a>
    </li>
  </ul>
</div>


<?php if ($_POST["param1"] != "param1") { ?>
<script src="/js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
  
  $('.load_page').on('click', function(){
    var link = $(this).attr("href");
    var title = $(this).attr("title");
    $('title').text(title);
    $(".menu>ul>li>a").removeClass("active");
    $(this).addClass('active');
    
    $(".content").load(link,
      {
        param1: "param1"
      },
      function(){
        var redirect = link;
        history.pushState('', '', redirect);
      }
    );
    return false;

  });

</script>

</body>
</html>
<?php } ?>

То есть, при прямом переходе по ссылке получаем полностью всю страницу, если подгружаем страницу с post параметром, то получаем только нужный нам блок с контентом.

Вопрос и проблема в следующем, если мы заходим на страницу набрав адрес в браузере, то у нас на все ссылки с классом load_page отрабатывает скрипт.
И если мы зайдем на страницу home, нажмем по ссылке в меню, например link1, то у нас отработает скрипт и подгрузит блок content со страницы page1.php.
Но при дальнейшем нажатии на ссылки которые есть в подгруженном скриптом блоке content, наш скрипт ссылки видеть не будет, и не отработает. Как это исправить?