Remove link when on the same page

Remove link when on the same page

How do I remove only certain elements inside an tag, not all of it (like unwrap() does)? For instance I have:

  1. <div id="container">
  2. <a href="#page1" class="link" id="page1link" onclick="return false">1</a>
  3. <a href="#page2" class="link" id="page2link" onclick="return false">2</a>
  4. </div>

  5. <div id="page1" class="page"> stuff </div>
    <div id="page2" class="page"> stuff </div>




When I'm on page 1 (I fade out/in pages when clicking the link, so if I'm on page1 then page2 is invisible) I'd like the "1" to be only text, and same thing if I'm on page 2, no link attached to it, so I used:

  1. if ($('.page').is(':visible')) {
     var pagelink = $(this.getAttribute("id"));
     var siblinglinks = 

    $(this.siblings().getAttribute("id"));
     $('#'+pagelink+'link').contents().unwrap(); //eg if "page1" visible, unwrap "#page1link" 

  2. $('#'+pagelink+'link').siblings().contents().wrap('<a href='+'"'+'#'+pagelink+'"'+'onclick="return false" class="link" id='+'"'+siblinglinks+'"'+'>'+'</a>'); 
  3. }

This is what I can come up with for now but it doesn't work... probably due to some syntax mistake. And it kind of looks like a hack, is there a more convenient way to do this? I know lots of websites disable the link for the page you're currently on, maybe there's some jQuery for this.