title: How do I hide the next button after the last div content in jquery
body: <p>What I want to be able to do is load the page, then only have the next button display, after I clcik next, then display the previos and next button, then keep going through the different divs, and after you get to the last div, hide the next button and only show the previous button.</p>
  
  <p>Jquery form slider Script</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function () {
      var oldOption;
      var currentOption;
      var counter = 1;
      var maxThings = 4;
      $("#2").hide();
      $("#3").hide();
      $("#4").hide();
      $("#forward").click(function () {
          $("#1").hide();
          $("#2").hide();
          $("#3").hide();
          $("#4").hide();
          if (!(counter &gt;= maxThings)) {
              counter++;
          }
          $("#" + counter).show();
      });
  
      $("#back").click(function () {
          $("#1").hide();
          $("#2").hide();
          $("#3").hide();
          $("#4").hide();
          if (!(counter &lt;= 1)) {
              counter--;
          }
          $("#" + counter).show();
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Calculate Script</p>
  
  <pre><code>&lt;script&gt;
  function calculate() {
      var total = (parseInt($('#studenttut option:selected').val()) + parseInt($('#campusrb&gt;option:selected').val())) * parseInt($('#yearsatten&gt;option:selected').val());
      $("#total").text(total);
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;form&gt;
  &lt;div id="1"&gt;
  &lt;table width="100%"&gt;
  &lt;tr&gt;
      &lt;td&gt;Are you an In-State-Student?&lt;/td&gt;
      &lt;td align="right"&gt;
          &lt;select id="studenttut"&gt;
              &lt;option value="&lt;?php echo $NIST; ?&gt;"&gt;Yes $&lt;?php echo $IST;  ?&gt;&lt;/option&gt;
              &lt;option value="&lt;?php echo $NOST; ?&gt;"&gt;No $&lt;?php echo $OST; ?&gt;&lt;/option&gt;
          &lt;/select&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  
  &lt;div id="2"&gt;
  &lt;table width="100%"&gt;
  &lt;tr&gt;
      &lt;td&gt;Are you staying on campus?&lt;/td&gt;
      &lt;td align="right"&gt;
          &lt;select id="campusrb"&gt;
              &lt;option value="&lt;?php echo $NBS; ?&gt;"&gt;Yes $&lt;?php echo $BS; ?&gt;  &lt;/option&gt;
              &lt;option value="1"&gt;No $0&lt;/option&gt;
          &lt;/select&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  
  &lt;div id="3"&gt;
  &lt;table width="100%"&gt;
  &lt;tr&gt;
      &lt;td&gt;How many years are you planning to attend?&lt;/td&gt;
      &lt;td align="right"&gt;
          &lt;select id="yearsatten"&gt;
              &lt;option value="1"&gt;1&lt;/option&gt;
              &lt;option value="2"&gt;2&lt;/option&gt;
              &lt;option value="2"&gt;3&lt;/option&gt;
              &lt;option value="3"&gt;3&lt;/option&gt;
              &lt;option value="4"&gt;4&lt;/option&gt;
              &lt;option value="5"&gt;5&lt;/option&gt;
              &lt;option value="6"&gt;6&lt;/option&gt;
              &lt;option value="7"&gt;7&lt;/option&gt;
              &lt;option value="8"&gt;8&lt;/option&gt;
          &lt;/select&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  
  &lt;div id="4"&gt;
  &lt;div id="total"&gt;&lt;input type="button" onClick="calculate()" value="calculate"/&gt;&lt;/div&gt;
  &lt;/form&gt;
  
  &lt;/div&gt;
  &lt;button id="back"&gt;Back&lt;/button&gt;
  &lt;button id="forward"&gt;Next&lt;/button&gt;
  </code></pre>