CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user3848698
user3848698

Reputation: 322

Add class to a div which previously had a active class

How do I add the class="demo" to the 

<div class="single-step active">

Which previously had the class="active"

On the click of next button with id="sf-next"

This is the demo

This is what i have used till now.

$("#sf-next").click(function() {
     $(".active").addClass("done");
});

But when I click next, class="active" moves to the second div and so does the class="done".

But this should not be the case. Class="done" should be added to the div which previously had the class="active".

Upvotes: 0

Views: 149

Answers (4)

webcodecs
webcodecs

Reputation: 217

If its really a next button you can apply the new class instead of the actual "active" to the prev active

$("#sf-next").click(function() {
 $(".active").prev().addClass("done");
});

Otherwise you have to find out the point where the active class changed and execute your onclick function before this point.

Upvotes: 1

Karthik
Karthik

Reputation: 74

I can't debug your html. But the possible solutions are:

1.Either make the div you want to add class as the parent of your button and then use

$("#sf-next").click(function() {
 $(this).parent().addClass("done");
});

2. Or if you putting both the button and div in the same parent div, use this:

$("#sf-next").click(function() {
   $(this).parent().find('.active').addClass("done");   
});

In both cases i am getting the current object of the div. Hope you got my point. Happy coding.

Upvotes: 0

Shafeeq Ur Rahman
Shafeeq Ur Rahman

Reputation: 11

Now this will be happening beacuse there is some other javascript which is adding the class active to it. So what you have to do is either of the 2 things

1) Modify the same method that is adding the class active to add it to the same element rather than doing to the next element and at the same time add the done class too.

2) Before that method is getting called add class 'done' to class 'active' and after that method is called add 'active' to 'done'.


If you can add that method which is adding active I will be able to help you better.

Upvotes: 0

hadi
hadi

Reputation: 1120

it's quit simple buddy. just give the div an id like myDivId. then create a function like bellow:

function myfunction(){document.getElementById("myDivId").setAttribute("class","demo");}

next thing you shoud do is to add an onclick=myfunction() to button. simple like that

Upvotes: 0

Related Questions