jQuery: Via Selektor auf div zugreifen

[qde]

Hi,

ich habe mal wieder ein kleines Problem. Dieses mal möchte ich ein "loading"-Bild einblenden. Da ich allerdings mehrere dieser Klassen habe, ist es nicht möglich einfach über jQuery('classname').fadeIn('fast'); zu gehen.

Hier mein HTML und der Versuch die Klasse anzusprechen (die wichtige Zeile ist fett markiert):

<div id="Chart'+ wid.WidgetId+ '" align="center" style="height:300px; width:450px;display:none;"></div>
  <div class="widget-column">
   <div class="widget movable">
    <div class="widget-content">

<div id="widgetContainer">
<div class="WidgetNr" style="display:none;">${widgetId}</div>
 <div class="widget">
                      <!--[if lte IE 6]>
<div class="ie6">
<![endif]-->
                      <div class="corner_topleft">
                        <div class="border_top">
                          <div class="gloss"> </div>
                        </div>
                      </div>
                      <div class="corner_topright"> </div>
                      <!-- Graphic Border - End Top -->
                      <div class="box_header">
                        <div class="icon_bar">
                          <a href="#" alt="expand" title="expand" class="toggle"><img src="http://www.tutorials.de/forum/Content/image/widget/expand.gif" title="expand" alt="expand" /></a>
                          <a href="#" alt="minus" title="minus" class="toggle"><img src="http://www.tutorials.de/forum/Content/image/widget/minus.gif" title="minus" alt="minus" /></a>
                          <a href="#" alt="move" title="move" class="widget-header"><img src="http://www.tutorials.de/forum/Content/image/widget/move.gif" title="move" alt="move" /></a>
                          <a href="#" alt="close" title="close" class="toggle"><img src="http://www.tutorials.de/forum/Content/image/widget/close.gif" title="close" alt="close" /></a>
                          <a href="#" alt="help" title="help" class="toggle"><img src="http://www.tutorials.de/forum/Content/image/widget/help.gif" title="help" alt="help" /></a>
                        </div>
                           <div class="widget-header"> <h1 class="WidgetCaption">${WidgetTitle}</h1></div>
                      </div>
                      <div class="border_right">
                        <!--[if lte IE 6]>
            <div class="ie6_borderright"> </div>
            <![endif]-->
                        <div id="Details">
                        ${details}
                        </div>
                        
                        <div id="widgetContent">
                        <div class="loading" style="display:none;text-align:center;"><img src="http://www.tutorials.de/forum/Content/image/ajax-loader.gif" alt="Loading..." /></div>
                          ${widgetContent}
                        </div>
                        
                      </div>
                      <!-- Graphic Border - Begin Bottom -->
                      <div class="corner_bottomleft">
                        <div class="border_bottom"> </div>
                      </div>
                      <div class="corner_rightbottom"> </div>
                      <!-- Graphic Border - End Bottom -->
                      <!--[if lte IE 6]>
                        </div>
                      <![endif]-->
                    </div>
                    
                </div>
            </div>
</div>
</div>
</div>

Mein jQuery dazu sieht so aus: jQuery("#Chart"+wid.WidgetId + ".loading").fadeIn('fast');

Irgendwo habe ich mal gesehen, dass man so in den "Kindelementen" navigieren kann. Aber das funktioniert (natürlich) nicht. Hat jemand von euch vielleicht einen Lösungsansatz?

Vielen Dank!

 

[kuddeldaddeldu]

Hi,

Irgendwo habe ich mal gesehen, dass man so in den "Kindelementen" navigieren kann.

Vermutlich in der Dokumentation?

Versuch mal:

$("#widgetContent > .loading")

LG