CODEWITHSUNDEEP
javascriptjquery
Muhammad Akber Khan
Muhammad Akber Khan

Reputation: 757

Jquery click event causing loop to execute only one time

I want to show next five divs each time when i click show more button, 5 divs will be shown default when load, here is my code,

var counterBox = 5;
$("#show_more_location").click(function() {
    $(".loading-container").show();
    for (var inc = 5; inc <= 5; inc++) {
        if(counterBox<50){
            counterBox = counterBox + 1;
            $(".location-box:nth-child("+counterBox+")").slideDown().addClass("show_box").delay(100);
        }  
    }
    $(".loading-container").delay(5000).hide();         
});

Problem is that when I click show more button, it loops only once, and stops. Only one div is showing ,I want to show 5 divs on show buttonclick.

Can anyonehelp?

Upvotes: 2

Views: 1355

Answers (2)

OddBrew
OddBrew

Reputation: 498

It seems you init your inc iterator with 5, and get out of the loop when it's higher than 5: 

for (var inc = 5; inc <= 5; inc++) {
   ...
}

Try initializing it with 1:

for (var inc = 1; inc <= 5; inc++) {
   ...
}

Upvotes: 3

Paul de Koning
Paul de Koning

Reputation: 532

You're setting inc in the for loop to 5, then checking if it is lower than or is 5. So it runs once. Make inc 0 to run it 6 times.

Upvotes: 0

Related Questions