title: Changing location.href in javascript using if statement
body: <p>We have kept a scroll view inside a division tag. Only one paragraph should appear inside the division tag. When the next button is pressed the next paragraph should appear.</p>
  
  <p>We have used location.href property to go to the next paragraph. When the button is clicked once it goes to the second paragraph, but when it is clicked for the second time it stays there and does not go to the third paragraph. What do you think is the problem ?</p>
  
  <p>My Code : </p>
  
  <pre><code>    &lt;body&gt;
       &lt;div&gt;
      &lt;p id="one"&gt;HI&lt;/p&gt;
      &lt;p id="two"&gt;Hello&lt;/p&gt;
      &lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
      &lt;p id="three"&gt;Howdy&lt;/p&gt;
  &lt;/div&gt;
  &lt;button type="button" onclick="next()"&gt;Next&lt;/button&gt;
  &lt;/body&gt;
  
  
  
  div{
          border: 1px solid black;
          height: 200px;
          width: 500px;
          overflow: auto;
      }
  
  
  
  function next () {
          if (location.href="#one") {
              location.href="#two";
          }
           else if (location.href==="#two") {
              location.href="#three";
          } }
  </code></pre>