How can i generate code through loop by counting elements in jquery

Question

I want to count element dynamically and generate code as per elements are available in HTML

here is code:

$(window).load(function(){                                                

var count= $(".accordion .toggle").length;
var i;

for(i=0; i<=count; i++){
    $(".accordion li a").eq(i).click(function(){
    alert(i+" image");
    $(".accordian-left-image img").attr('src','https://img'+i+'.jpg');
    });
}; });

Code Details: .accordion .toggle is elements and it's generated dynamically, between for loop code its works when I click on the element it will show img src="img1.jpg" the same thing I want that works when 2nd elements are available and img2.jpg is available.

the issue I am facing is if elements are available 6 then code generate 6th for all elements. but I want to be separated for all.

Can you please provide your html as well and put it into a working snipped? — Patrick Schocke
– Patrick Schocke, Commented Nov 6, 2018 at 10:39
I don't understand your question, you say that with your code you are getting for 6 elements the image img6.jpg for all of them? — Brank Victoria
– Brank Victoria, Commented Nov 6, 2018 at 10:40
You don't need a loop for this. Assuming your HTML is structured well then you can just use DOM traversal. We'd need to see your HTML to give you an example of this, though — Rory McCrossan
– Rory McCrossan, Commented Nov 6, 2018 at 10:43

Patrick Schocke · Accepted Answer · 2018-12-22 07:43:10Z

1

This is because $(".accordian-left-image img").attr('src','https://img'+i+'.jpg'); selects every accordian-left-image class. To fix this, use the .eq() selector:

$(".accordian-left-image img").eq(i).attr('src','https://img'+i+'.jpg');

edited Dec 22, 2018 at 7:43

answered Nov 6, 2018 at 10:42

Patrick Schocke

1,4912 gold badges15 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can i generate code through loop by counting elements in jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related