title: Go to another page and load ajax call on that page via href
body: <p>On page 1 I have a navigation with links which calls ajax and lists all portfolio items in that category</p>
  
  <p>nav links look like this:</p>
  
  <pre><code>&lt;nav class="pos-relative filter filter-underline"&gt;
      &lt;a href="javascript:void(0)" class="all ajax" data-object="portfolio" data-view="list-grid-textbelow" data-section="project-list" data-category-id="*" data-limit="50" data-noresult-message="No more result found."&gt;
                  All&lt;/a&gt;
      &lt;div class="loading" style="display: none;"&gt;&lt;/div&gt;
      &lt;a href="#arhitecture" class="ajax active" id="cat-filter-arhitecture" data-object="portfolio" data-view="list-grid-textbelow" data-section="project-list" data-category-id="16" data-limit="50" data-noresult-message="No more result found."&gt;
                          Arhitecture&lt;/a&gt;
      &lt;div class="loading"&gt;&lt;/div&gt;
      &lt;a href="#design" class="ajax" id="cat-filter-design" data-object="portfolio" data-view="list-grid-textbelow" data-section="project-list" data-category-id="19" data-limit="50" data-noresult-message="No more result found."&gt;
                          Design&lt;/a&gt;
      &lt;div class="loading"&gt;&lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>Js used for this:</p>
  
  <pre><code>/* ========================================================================
   * DOM-based Routing
   * Based on http://goo.gl/EUTi53 by Paul Irish
   *
   * Only fires on body classes that match. If a body class contains a dash,
   * replace the dash with an underscore when adding it to the object below.
   *
   * .noConflict()
   * The routing is enclosed within an anonymous function so that you can 
   * always reference jQuery with $, even when in .noConflict() mode.
   *
   * Google CDN, Latest jQuery
   * To use the default WordPress version of jQuery, go to lib/config.php and
   * remove or comment out: add_theme_support('jquery-cdn');
   * ======================================================================== */
  
  (function($) {
  
  "use strict";
  
  // Projects list view (Portfolio)
  var project_list = function () {
      // if found #hash in URL,
      //    get ID of category, and in found cat_id, than, ajax start
  },
  
  // Use this variable to set up the common and page specific functions. If you 
  // rename this variable, you will also need to rename the namespace below.
  Roots = {
    // All pages
    common: {
      init: function() {
          // JavaScript to be fired on all pages
  
          // ajax event
          $('a.ajax').click( function(e) {
                  e.preventDefault();
  
                  var $linkAjaxClicked = $(this), $navLinkAjaxClicked;
                  // navigation of filter links
                  $navLinkAjaxClicked = $linkAjaxClicked.parent('nav').length ? $linkAjaxClicked.parent('nav') : $linkAjaxClicked.parent().parent('nav');
  
                  if (typeof $linkAjaxClicked.data('section') === 'undefined' ||
                      typeof $linkAjaxClicked.data('object') === 'undefined' ||
                      typeof $linkAjaxClicked.data('limit') === 'undefined') {
                          console.log('AJAX ERROR: Missing some required data. Required HTML5 data-* attributes are: "data-section", "data-object" and "data-limit".');
                          return false;
                  }
  
                  var $parentSection = $('section.' + $linkAjaxClicked.data('section')), // parent &lt;section&gt; class name
                      $answerContainer = $('#' + $linkAjaxClicked.data('object') + '-ajax-data'), // answer data container ID
                      ajaxData = window[ $linkAjaxClicked.data('object') ], // ajax WP config data object
                      view = typeof $linkAjaxClicked.data('view') !== 'undefined' ? $linkAjaxClicked.data('view') : 0, // view of file e.g. portfolio-"LIST-GRID".php
                      reponse_action = typeof $linkAjaxClicked.data('adding') !== 'undefined' ?
                          $linkAjaxClicked.data('adding') :
                          'replace', // append | replace
                      data2send = {}, $item, limit = $linkAjaxClicked.data('limit'),
                      offset = typeof $linkAjaxClicked.data('offset') !== 'undefined' ? $linkAjaxClicked.data('offset') : 0,
                      categoryId = typeof $linkAjaxClicked.data('category-id') !== 'undefined' ?
                          $linkAjaxClicked.data('category-id') :
                          '*',
                      $btnMore = $parentSection.find('.btn-more'), $btnLoading = $btnMore.next('.loading'),
                      $containerLoading = $('&lt;div class="loading"&gt;&lt;/div&gt;'), $filterLoading = $parentSection.find('.filter .loading').first(),
                      noResultMessage = typeof $linkAjaxClicked.data('noresult-message') !== 'undefined' ?
                          $linkAjaxClicked.data('noresult-message') :
                          'No more result found.',
                      offsetSource = typeof $linkAjaxClicked.data('offset-source') !== 'undefined' ?
                          $linkAjaxClicked.data('offset-source') :
                          false;
  
                  // set category ID on "load more" button
                  $parentSection.find('.btn-more').data('category-id', categoryId);
  
                  // select "active" filter navigation link
                  if ( $navLinkAjaxClicked.length ) {
                      $navLinkAjaxClicked.find('.ajax').removeClass('active');
                      $linkAjaxClicked.addClass('active');
                  }
  
                  // loading effect
                  //$linkAjaxClicked.append('&lt;i class="icon-spinner animate-spin"&gt;&lt;/i&gt;');
                  $btnLoading.show();
                  $filterLoading.show();
                  if ( reponse_action === 'replace' ) { // only when we replace content, this content is blocked during AJAX loading
                      $containerLoading.appendTo($answerContainer).fadeIn();
                  }
  
                  if (offsetSource === 'item') {
                      $item = $answerContainer.find('.item');
                      offset = $item.length;
                  }
  
                  // data sending by ajax
                  data2send = {
                      action: ajaxData.action,
                      view: view,
                      limit: limit,
                      offset: offset,
                      nonce: ajaxData.nonce,
                      catid: categoryId,
                      pagination: false
                  };
                  // ajax start
                  $.ajax({
                      type: 'POST',
                      url: ajaxData.url,
                      data: data2send,
                      complete: function () {
                          // turn off loader effect
                          $linkAjaxClicked.find('.icon-spinner').remove();
                          $btnLoading.hide();
                          $filterLoading.hide();
                          $containerLoading.hide();
                      },
                      success: function ( response ) {
  
                          if ( response === '' ) { // empty response
                              var extracss = $answerContainer.hasClass('masonry') ? 'item' : 'hide-item';
                              response  = '&lt;div class="col-xs-12 '+extracss+'"&gt;';
                              response += '    &lt;div class="text-center text-upper alert alert-info"&gt;'+noResultMessage+'&lt;/div&gt;';
                              response += '&lt;/div&gt;';
                          }
  
                          var $response = $(response);
  
                          if ( reponse_action === 'replace') { // default action
                              $answerContainer
                                  .html( $response )
                                  .find('.hide-item').fadeIn('normal');
  
                          } else if ( reponse_action === 'append') {
                              $answerContainer
                                  .append( $response )
                                  .find('.hide-item').fadeIn('slow');
                          }
  
                          if ( response !== '' ) {
                              // animate.css
                              animate.setDelay( $('.animated') ); // again setted .animated elements, because it is new elements generated by AJAX
                              animate.start( animate.itemsInside($answerContainer) );
  
                              // set Magnific Popup  [http://dimsemenov.com/plugins/magnific-popup/]
                              // definition of "setMagnificPopup" function is on the top of main.js file
                              $answerContainer.find('.magnific-gallery').each(setMagnificPopup);
  
                              // jQuery panr [https://github.com/robbue/jquery.panr]
                              // definition of "configPanr" object is on the top of main.js file
                              var $wppostimage = $('.no-touch .wp-post-image');
                              if (typeof $wppostimage.panr === 'function' &amp;&amp; $wppostimage.length) {
                                  $wppostimage.panr(configPanr);
                              }
  
                              // WordPress-Post-Like-System  [https://github.com/JonMasterson/WordPress-Post-Like-System]
                              // definition of "setLikeSystem" function is on the top of main.js file
                              $answerContainer.find('.jm-post-like').click(setLikeSystem);
  
                              // Masonry  [http://masonry.desandro.com/]
                              if ( $answerContainer.hasClass('masonry') ) {
  
                                  if ( reponse_action === 'replace') { // default action
                                      $answerContainer
                                          .masonry('destroy')
                                          .imagesLoaded( function() {
                                              $answerContainer.masonry({
                                                  itemSelector: '.item'
                                              });
                                          });
                                  } else if ( reponse_action === 'append') {
                                      $answerContainer
                                          .imagesLoaded( function() {
                                              $answerContainer.masonry('appended', $response);
                                          });
                                  }
                              }
                              // Owl Carousel 2  [http://www.owlcarousel.owlgraphic.com/]
                              // definition of "setOwlCarousel" function is on the top of main.js file
                              else if ( $answerContainer.hasClass('owl-carousel') ) {
                                  $answerContainer.trigger('destroy.owl.carousel');
                                  $answerContainer.each(setOwlCarousel);
                              }
                          }
                      }
                  });
          });
      }
    },
    // Home page
    home: {
      init: function() {
        // JavaScript to be fired on the home page
      }
    },
    // Portfolio: Project List
    page_template_list_fullscr_portfolio_php: {
      init: project_list
    },
    // Portfolio: Project List
    page_template_list_grid_portfolio_php: {
      init: project_list
    },
  };
  
  // The routing fires all common scripts, followed by the page specific scripts.
  // Add additional events for more control over timing e.g. a finalize event
  var UTIL = {
    fire: function(func, funcname, args) {
      var namespace = Roots;
      funcname = (funcname === undefined) ? 'init' : funcname;
      if (func !== '' &amp;&amp; namespace[func] &amp;&amp; typeof namespace[func][funcname] === 'function') {
        namespace[func][funcname](args);
      }
    },
    loadEvents: function() {
      UTIL.fire('common');
  
      $.each(document.body.className.replace(/-/g, '_').split(/\s+/),function(i,classnm) {
        UTIL.fire(classnm);
      });
    }
  };
  
  $(document).ready(UTIL.loadEvents);
  
  })(jQuery); // Fully reference jQuery after this point.
  </code></pre>
  
  <p>Now I want to make a link on page 2, which will take me to page 1 and call that ajax and display the desired category (lets say design).</p>
  
  <p>I tried to insert a href and link it to the <a href="http://somesite/page1/#design" rel="nofollow">http://somesite/page1/#design</a> but ofcourse it does not work. It loads page 1 but ajax is not called. What should I include for that link to work?</p>