CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3
Viira
Viira

Reputation: 3911

Accordion toggle for selected div

I'm using bootstrap 3 for my new project, I wanted to use bootstrap accordion menu. Everything works fine here.

My problem here is the toggle icon.

I need to rotate the × only for the selected div.

This is what I tried:

var targetDiv = $('.tog');
var i = 0;
var degrees;
var rotation;

$('.tog').click(function() {
    i++;
    degrees = i * -45;
    rotation = 'rotate(' + degrees + 'deg)';
   targetDiv.css('-webkit-transform', rotation);
    });

Here is the link to fiddle: https://jsfiddle.net/5pLwxus7/5/

As you can see when the .tog is clicked all the remaining divs also respond.

I'll appreciate any help.

Upvotes: 2

Views: 97

Answers (1)

mmk
mmk

Reputation: 505

You can use currentTarget to find out the div which is currently clicked. See the updated fiddle here :

https://jsfiddle.net/n6xd8953/

//var targetDiv = $('.tog');
var i = 0;
var degrees;
var rotation;

$('.tog').click(function(event) {
    var currentDiv = event.currentTarget;
    i++;
    degrees = i * -45;
    rotation = 'rotate(' + degrees + 'deg)';
    $(currentDiv).css('-webkit-transform', rotation);
});

Upvotes: 4

Related Questions