jquery - Fade out current and fade in anchor on JavaScript -

i've got simple problem don't know how deal because i'm learning javascript

what want link navigation anchor fade in/out content. that, must current page id , anchor href javascript.

this got far: (please note in script simple calling method don't know yet)

$(btn).click(function(e){        $(*/current page/*).fadeout('slow', function(){          $(*/destiny page/*).fadein('slow');      });  });

#page2, #page3 {    display:none;    }    

<div id="page1">    page 1 content    <br>      <a href="page2" id="btn">show page 2 , hide page</a>    <br>      <a href="page3" id="btn">show page 3 , hide page</a>  </div>    <div id="page2">    page 2 content    <br>      <a href="page1" id="btn">show page 1 , hide page</a>    <br>      <a href="page3" id="btn">show page 3 , hide page</a>  </div>    <div id="page3">    page 3 content    <br>      <a href="page1" id="btn">show page 1 , hide page</a>    <br>      <a href="page2" id="btn">show page 2 , hide page</a>  </div>

i apreciate , efforts!

for referring group of elements need use btn class , id should unique , can use refer single element.

// bind click event  $('.btn').click(function(e) {     // prevent default click event action    e.preventdefault();    // id next page based on clicked element    var next = $(this).attr('href');    // parent hide , fadeout    $(this).parent().fadeout('slow', function() {      // element show , fade in      $('#' + next).fadein('slow');    });  });

#page2,  #page3 {    display: none;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <div id="page1">    page 1 content    <br>    <a href="page2" class="btn">show page 2 , hide page</a>    <br>    <a href="page3" class="btn">show page 3 , hide page</a>  </div>    <div id="page2">    page 2 content    <br>    <a href="page1" class="btn">show page 1 , hide page</a>    <br>    <a href="page3" class="btn">show page 3 , hide page</a>  </div>    <div id="page3">    page 3 content    <br>    <a href="page1" class="btn">show page 1 , hide page</a>    <br>    <a href="page2" class="btn">show page 2 , hide page</a>  </div>