title: muiltipe times show or hide using jquery
body: <p>I am new to jquery and Javascript still I am learning and I am working on the same.</p>
  
  <p>The below question might be simple for the experience people.</p>
  
  <p>Kindly help me </p>
  
  <p>Actually I am trying for one page portfolio.</p>
  
  <p>1) Two divs column in my page left &amp; right
  2) In left I have navigation which has three links &amp; right I have content
  3) By default my first link of the content will be shown display: block; but the rest will be shown disable. Once I click the second link the first page of the content should be hide and the second content should shown the same thing for the third henceforth.</p>
  
  <p>Right now my code is </p>
  
  <pre><code>&lt;div id="navi"&gt;
  &lt;ul&gt;
        &lt;li&gt;&lt;a href="#first"&gt;First link&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#second"&gt;Second link&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#third"&gt;Third link&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;div id="content1" style="display:block;"&gt;
  &lt;a href="#"&gt;#first&lt;/a&gt;
      Check first content
  &lt;/div&gt;
  &lt;div id="content2" style="display:none;"&gt;
  &lt;a href="#"&gt;#Second&lt;/a&gt;
      Check first content
  &lt;/div&gt;
  &lt;div id="content3" style="display:none;"&gt;
  &lt;a href="#"&gt;#third&lt;/a&gt;
      Check first content
  &lt;/div&gt;
  </code></pre>
  
  <p>Kindly help me how to do </p>