CODEWITHSUNDEEP
jqueryhtmlnumberssequence
pajar
pajar

Reputation: 43

How to make sequence number from attribute class Div which have random number with jQuery?

I have a div like this:

<div id="masterDiv">
  <div id="childDiv" class="3" ></div>
  <div id="childDiv" class="5" ></div>
  <div id="childDiv" class="10" ></div>
</div>

How can I make value from attribute class become sequence number when clicked? Like this:

<div id="masterDiv">
  <div id="childDiv" class="1" ></div>
  <div id="childDiv" class="2" ></div>
  <div id="childDiv" class="3" ></div>
</div>

Upvotes: 1

Views: 1038

Answers (4)

hitesh bariya
hitesh bariya

Reputation: 1

Code sample:

$("#masterDiv > div").attr("class", function(arr) {return "classname"+arr;})
});

Upvotes: 0

Prashanth Thurairatnam
Prashanth Thurairatnam

Reputation: 4361

Ideally id values should be unique. That is the whole purpose of using an id. In your case instead of id make use of multiple class names

<div id="masterDiv">
 <div class="childDiv 3" ></div>
 <div class="childDiv 5" ></div>
 <div class="childDiv 10" ></div>
</div>

then try this (I've slightly modified Rory's solution)

$(".childDiv").each(function(index) {
 $(this).removeClass().addClass(index + 1).addClass("childDiv");
});

Upvotes: 1

Teun Zengerink
Teun Zengerink

Reputation: 4393

$(document).ready(function(){
    $("#masterDiv > div").each(function(i, item){
        $(this).attr("class", i + 1);      
    });            
});​

Upvotes: 2

Rory McCrossan
Rory McCrossan

Reputation: 337626

Try this:

$(".childDiv").each(function(index) {
    $(this).removeClass().addClass(index);
});

Upvotes: 0

Related Questions