Javascript css Unterstreichung entsprechend umgeschaltet divs

Question

Hey alle, Früher habe ich einige Hilfe toggeln zwischen drei versteckte divs in einer Fotobibliothek erhalten. Ich möchte den Anchors eine Unterstreichung hinzufügen, die anzeigt, welches div angezeigt werden soll. Das Skript ist dynamisch ... und darin liegt mein Problem. Ich bin mir nicht sicher, wie ich den Anker innerhalb des Codes unterstreichen soll. Es genügt zu sagen, dass es außerhalb meiner Reichweite ist!

Ich möchte auch für den ersten der drei Anker, Promo, unterstrichen laden.

Danke für Ihre Hilfe!

HTML:

<div class="text" id="content"> 
    <h2>PHOTOS</h2> 
    <hr /> 
    <p align="left"><a class="showlink" id="show_promo">PROMO</a> <a class="showlink" id="show_studio">STUDIO</a> <a class="showlink" id="show_live">LIVE</a></p> 
    <div class="section" id="promo"> 
     <p align="center">PROMO</p> 
     <p align="center"> 
      <img src="#"> 
      </p> 
    </div> 
    <div class="section" id="studio"> 
     <p align="center">STUDIO</p> 
     <p align="center"> 
      <img src="#"> 
      </p> 
    </div> 
    <div class="section" id="live"> 
     <p align="center">LIVE</p> 
     <p align="center"> 
      <img src="#"> 
      </p> 
    </div> 
</div> 

Javascript:

$('a.showlink').click(function(){ 
    var toShow = this.id.substr(5); 
    $('div.section:visible').fadeOut(600, function(){ 
     $('#' + toShow).fadeIn(600); 
    }); 
}); 

Answer 1

Try this:

$(function(){ 
    $('a.showlink').css("text-decoration", "none"); 
    $("#show_promo").css("text-decoration", "underline").click(); 
}); 
$('a.showlink').click(function(){ 
    $('a.showlink').css("text-decoration", "none"); 
    $(this).css("text-decoration", "underline"); 
    var toShow = this.id.substr(5); 
    $('div.section:visible').fadeOut(600, function(){ 
     $('#' + toShow).fadeIn(600); 
    }); 
});