Ich habe folgendes:

<li>
   <a id="show">
      <div class="sprite-blank" ></div></a></li>

Wie kann ich jQuery verwenden, um dies zu ändern in:

<li>
   <a id="show">
      <div class="sprite-balloon" ></div></a></li>
0
user1679941 8 Okt. 2012 im 05:34

4 Antworten

Beste Antwort
$('li a#show div').removeClass('sprite-blank').addClass('sprite-balloon');

Sie können auch toogleClass() verwenden:

$('li a#show div').toggleClass('sprite-blank sprite-balloon');
4
Kaidul 16 Dez. 2012 im 10:44
$('.sprite-blank').toggleClass('sprite-blank sprite-balloon');

Das würde alle verfügbaren .sprite-blank Elemente auf der Seite ändern. Wenn Sie genauer sein müssen, ändern Sie einfach die anfängliche Auswahl, wie z

$('a > .sprite-blank').toggleClass('sprite-blank sprite-balloon');
2
jAndy 8 Okt. 2012 im 01:35

Einfach machen:

$(".sprite-blank").removeClass("sprite-blank").addClass("sprite-balloon");
1
Sidharth Mudgal 8 Okt. 2012 im 01:35

Ich denke du brauchst so etwas:

http://jsfiddle.net/yUaZe/

HTML

<li>
   <a class="show" href="#">Show
     <div class="sprite sprite-hide" >Test</div>
    </a>
</li>
<li>
   <a class="show" href="#">Show
     <div class="sprite sprite-hide" >Ha</div>
    </a>
</li>

CSS

.sprite-balloon {
    display:block;
}
.sprite-hide {
 display:none;   
}
​

JS

$('.show').click(
    function(event) {
    var that=$(this);
    event.preventDefault();
    that.find('.sprite').toggleClass('sprite-balloon');
    that.find('.sprite').toggleClass('sprite-hide');
    console.log(that);
    }
    );​
0
zb' 8 Okt. 2012 im 01:47