javascript - jquery addClass has no effect -


i have html:

<div class="container">     <div id="cell1" class="cell"><div class="content"></div></div>     <div id="cell2" class="cell"><div class="content"></div></div>     <div id="cell3" class="cell"><div class="content"></div></div> </div> 

css:

.container {     width: 300px;     height: 300px;     background-color: green; }  .cell {     background-color: red; }  #cell1 {     width: 70px;     height: 70px; }  #cell2 {     width: 70px;     height: 70px; }  #cell3 {     width: 70px;     height: 70px; }  .white {     background-color: white; }  .yellow {     background-color: yellow; }  .content {     width:40px;     height:40px;     background-color:blue; } 

javascript:

$(document).on('click', '.cell', function(e) {      $(this).parent().children().removeclass('white');     $(this).parent().children().children().removeclass('yellow');      $(this).addclass('white');     $(this).find('.content').addclass('yellow'); }); 

the problem having addclass('yellow') has no effect. however, if delete background-color in content class, works. thoughts why?

jsfiddle link: http://jsfiddle.net/rexwang/fwh6e/

thanks answers, works! don't using addclass , removeclass, posible use e.currenttarget.id achieve same goal?

it works .yellow background style overriden .content background style, since in stylesheet .content class goes after .yellow.

one way swap these classes in css.

demo: http://jsfiddle.net/fwh6e/2/


Comments

Popular posts from this blog

user interface - Python attempting to create a simple gui, getting "AttributeError: 'MainMenu' object has no attribute 'intro_screen'" -

jquery - Common JavaScript snippet to share files on Google Drive, Dropbox, Box.net or SkyDrive -

Android Gson.fromJson error -