CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user3051930
user3051930

Reputation: 19

Add css class on div

i have the following html code and i want to add on click the class "rotate" (which i have included in my css) to the div with class "barklogo" 

<div class="barklogo loaded" data-width="40" data-anim="left">
<img src="/images/home/button.png" border="0" alt="Demo image">
</div>

I found a similar post here

JQUERY - add CSS class to BUTTON element after click

But when i enter the following code to the js file it won't work

 $(document).ready(function(){
  $('barklogo').click(function(){
       $(this).addClass('rotate');
  });
 });

Here is the css code for the class .rotate

.rotate{
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
}

Thank you very much!

Upvotes: 0

Views: 811

Answers (5)

Chetan Prajapati
Chetan Prajapati

Reputation: 71

Its really working by this way. But if u want in safe way to addClass which already have more than one class in div than use addClass to div by its ID. for example,

$("#div_id").click(function(){
    //code 
});

This is your useful way for this question. 

<script>

$('.barklogo').click(function(){
           $(this).addClass('rotate');
      });

</script>

Upvotes: 0

Krish R
Krish R

Reputation: 22711

You have missed to add . in selector,

    $(function(){
      $('.barklogo').click(function(){
           $(this).addClass('rotate');
      });
     });

Upvotes: 1

Somnath Kharat
Somnath Kharat

Reputation: 3600

You can also do this: Use . when u are using class selector

$(document).ready(function(){
  $('.barklogo .loaded').click(function(){
       $(this).addClass('rotate');
  });
 });

Upvotes: 1

Roopendra
Roopendra

Reputation: 7762

You missed . for class selector in jquery

Change $('barklogo').click(function(){ to $('.barklogo').click(function(){

Upvotes: 0

Satpal
Satpal

Reputation: 133403

You have to use . with class name in jquery.

 $('.barklogo').click(function(){

Class Selector (“.class”)

Upvotes: 3

Related Questions