Why my loop only returns one value?

Question

Here's my html code:

<div id="1">

  <div class="latest">
  </div>

  <div class="myclass">

  </div>

</div>

Here's my jquery:

$.each(data, function(k, v) {

    var len = data.length;

    $('.myclass').each(function() {

        if ($('.myclass').length == len) {
            $('.myclass').remove();
            $('.latest').prepend('<div class="myclass">' + v.TheDatas + '</div>');
        }

    });

});

My problem here is if the v.TheDatas has many values, for example the total value of the v.TheDatas is 5 then it Only gives the first value and print it 5 times. What i want is print the all data 5 times.

Can include example of `data` at Question ? What is expected result ? Is there single `.myclass` element ? — guest271314, May 12 '15 at 17:15
Watch your closures: http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example — FishBasketGordo, May 12 '15 at 17:16
You should have `var len = data.length` outside the loop, because you're not changing `data`. — Barmar, May 12 '15 at 17:17
I tried not to include the **$('.myclass').remove();** It gives me all the 5 datas but it also printed 5 time . haha. I dunno what to do. — Kean Allen, May 12 '15 at 17:24
@guest271314 for example ia have the datas= "a","b","c","d","e". My problem is it prints the **abcde** 5 times. — Kean Allen, May 12 '15 at 17:29
@KeanAllen Can include text of `data` at Question ? What is expected result ? Is `.myclass` only `.myclass` element at `html` ? Is full `html` included at original post ? — guest271314, May 12 '15 at 17:29
Is `data` an `Array` `["a","b", "c", "d", "e"]` ? Difficult to determine issue , or solution without viewing both all included `html` and `js` ? What is text of `data` object iterating at `$.each(data)` ? — guest271314, May 12 '15 at 17:32
@guest271314 .Yes it's an array. array from PHP. I already get my datas. But my problem is it prints 5 times when my total value of data is 5 also. — Kean Allen, May 12 '15 at 17:34
@KeanAllen How many total `.myclass` elements are at `html` ? Five ? One ? — guest271314, May 12 '15 at 17:35
@guest271314 The total `.myclass` elements will depend on the data. for example all the data from my array is 2 then this code will execute `$('.latest').prepend('
'+v.TheDatas');` Giving the total element of `.myclass` of 2 — Kean Allen, May 12 '15 at 17:38
`.myclass` is dynamically added ? Is a `.myclass` element dynamically created for each item within `data` array `["a","b", "c", "d", "e"]` ? — guest271314, May 12 '15 at 17:40
I have my `myclass` on the html and another `myclass` on the ajax. — Kean Allen, May 12 '15 at 17:44

Samurai · Answer 1 · 2015-05-12T17:30:23.310

1

Because the first match it finds, it removes all the elements with selector you run the loop for

$('.myclass').remove();

Instead of $('.myclass') inside each you should use $(this).

Something like:

$.each(data, function(k, v) {
    var len = data.length;

    $('.myclass').each(function() {
        if ($(this).length == len) {
            $(this).remove();
            $('.latest').prepend('<div class="myclass">' + v.TheDatas + '</div>');
        }
    });
});

edited May 12 '15 at 17:30

answered May 12 '15 at 17:14

Samurai

3,724
5
27
39

I tried not to include the **$('.myclass').remove();** It gives me all the 5 datas but it also printed 5 time . haha. I dunno what to do. – Kean Allen May 12 '15 at 17:24
1

Not sure if I understand what you're trying to achieve. You have a data array with length 5 let's say. So you have 5 `v.TheDatas`. How many `$('.myclass')` do you have overall? why you're looping through all of them for each data? `len` will always be the same value and so `$('.myclass').length` will match it only once, so two each seems very confusing. Can you explain what you're trying to do? – Samurai May 12 '15 at 17:37
Im trying to do a realtime reading of comments. The total `.myclass` element will depend on the data because of this code: `$('.latest').prepend('
+v.TheDatas');`
– Kean Allen May 12 '15 at 17:42
So I'm gonna throw a few more questions Each `.myclass` contains a comment? And as you add the latest ones you want to remove the oldest? or what is it that you remove? – Samurai May 12 '15 at 18:20
Once the page is being loaded there is already a .myclass in the page and in after 5 seconds the .myclass in the html will be replace new .myclass using the ajax call. – Kean Allen May 12 '15 at 18:25
For example I have 2 divs with an id 1 and 2. What I want is to place the comment into the div with an id match to the comment. for example i have v.ID, and that v.ID is equal to 1 so therefore the condition is if div#1 == v.ID { place the comment here } – Kean Allen May 12 '15 at 18:32

Why my loop only returns one value?

1 Answers1