jQuery Forum

I thought this was going to be trivial!!

I have a div, which I want to change colour when it is clicked.

The html:

1.     <div id="goContBtn">
           <div>
               GO!
           </div>
       </div>
   

The css:

1. #goContBtn {
       float:left;
       margin:80px 0 0 150px;
       width:100px;
       height:100px;
       cursor: pointer;
   }
   
   #goContBtn .neutral {   
       background-color: green;
   }
   
   #goContBtn .failedValidation {   
       background-color: red;
   }
   

JavaScript:

1.     jQuery(document).find(function() {
           $('#goContBtn').click(function() {
               $('#goContBtn').addClass('failedValidation');
           });
       });
   
       $(function() {
           // format the go button with default formatting
           $('#goContBtn').addClass('neutral');
       });
   

The javascript is between script tags below the html. The page already has a jQuery accordion and tooltips working on it. I'm just wondering whether I have misunderstood the impact of changing a class after page rendering?

The code above is test code and won't actually just directly change the colour of the div, it will be dependant on validation.

Thanks for your help.


Peter
A Linux Admin

Willing to help maintain Linux servers remotely for a tiny consideration into my Paypal account :-)