title: Get next slide title with jQuery (fullpage.js)
body: <p>I am trying to display the current and next slide section titles. So far, the current slide title is working perfectly but I cannot seem to grab the next slides' title.</p>
  
  <p>You will notice in the afterLoad function I am calling the nextIndex which updates correctly with 1,2,3 and so forth as I scroll through the sections. But I cannot get the actual title.</p>
  
  <p>Thanks in advance</p>
  
  <pre><code>//Variables
  var deleteLog    = false;           
  var currentTitle = jQuery('#current-title')
  var nextTitle    = jQuery('#next-title')
  
  // fullPage.js call
  jQuery('#fullpage').fullpage({
    verticalCentered  : true,
    navigation        : true,
    navigationPosition: 'right',
    slidesNavigation  : true,
    slidesNavPosition : 'bottom',
    responsiveWidth   : 768,
    scrollBar        : true,
    afterRender  : function(){
    wow.init();   
    },    
  
    afterLoad: function(anchorLink, index) {
      var loadedSection = jQuery(this);
      var projectTitle  = jQuery('.section.active .project-title').html();
          if (deleteLog) {
             currentTitle.html('');
           }
           currentTitle.append(projectTitle);
             deleteLog = true;              
           },
  
    onLeave: function(index, nextIndex, direction) {
     var projectTitle = jQuery('.section.active .project-title').html();
     if (deleteLog) {
      nextTitle.html('');
     }
     nextTitle.append(nextIndex);
       deleteLog = true;
    },
  </code></pre>
  
  <p>My stripped back header HTML where I want to dynamically add the section titles:</p>
  
  <pre><code>&lt;p&gt;
      &lt;span id="current-title"&gt;&lt;/span&gt; 
      &lt;span id="next-title"&gt;&lt;/span&gt;&lt;/a&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>My stripped back page content HTML: (Note the .active class which of course changes once you scroll down to each section)</p>
  
  <pre><code>&lt;div id="fullpage"&gt;
  
    &lt;div class="section active"&gt;
      &lt;h1 class="project-title post-title"&gt;Section Title One&lt;/h1&gt;
    &lt;/div&gt;&lt;!-- .section --&gt;
  
  &lt;div class="section"&gt;
      &lt;h1 class="project-title post-title"&gt;Section Title Two&lt;/h1&gt;
    &lt;/div&gt;&lt;!-- .section --&gt;
  
  &lt;div class="section"&gt;
      &lt;h1 class="project-title post-title"&gt;Section Title Three&lt;/h1&gt;
    &lt;/div&gt;&lt;!-- .section --&gt;
  
  &lt;/div&gt;&lt;!-- #fullpage --&gt;
  </code></pre>