Convert and add a collection of div values to Integers

Question

I have various rating values on a page; I want to get the average rating, however, what I thought would work is not so far.

<div class = "ratings">1</div>
<div class = "ratings">5</div>
<div class = "ratings">3</div>
<div class = "ratings">2</div>

I want to sum these ratings and find the average.

function overallRating()
{
       var items = document.getElementsByClassName("ratings");
       var itemCount = items.length;
       var sum= 0;

       for(var i = 0; i < itemCount; i++)
       {
            sum += parseInt(items[i].value);
            console.log(sum)
       }
}

The console log of sum returns NaN.

Can anyone let me know where I am going wrong?

why would this question get closed? and how does this question lead to -- _This question was caused by a problem that can no longer be reproduced or a simple typographical error._ . ? — Ousmane D., Apr 27 '17 at 18:16
@OusmaneMahyDiaw Every user can do as they please with their "vote". Logically, it does not. It could perhaps be argued that `.textContent` for `.value` substitution is negligible. The total omission of average of `sum` being returned cannot logically be proven to be a problem that would be corrected by a continuing to omit returning the average of `sum`. — guest271314, Apr 27 '17 at 18:19
@guest271314 _Every user can do as they please with their "vote"_ not really, there should be a **valid** reason to do so not because of _as they please with their "vote"_. — Ousmane D., Apr 27 '17 at 18:28
@OusmaneMahyDiaw Well, that clearly is not the case. "should be" does not exist. "valid" as to evaluation of a "vote" should be limited to whether the "vote" was allowed in the first instance, and "free" in the second instance. — guest271314, Apr 27 '17 at 18:29
@guest271314 guess I will have to fight the case if "closed" to get it reopened and will have to stress this to the meta site **again**. close votes should be taken seriously and **not** _as they please with their "vote"_. — Ousmane D., Apr 27 '17 at 18:30
@OusmaneMahyDiaw Good luck at meta. The proof of reasons selected not being logically applicable are at first comment above. — guest271314, Apr 27 '17 at 18:31
@OusmaneMahyDiaw Needs more "downvote" http://stackoverflow.com/questions/43103717/on-click-get-input-value-using-jquery/43103840#43103840, http://stackoverflow.com/questions/43663975/checking-for-an-empty-string-array/43664408#43664408 — guest271314, Apr 27 '17 at 18:32
@OusmaneMahyDiaw It must be noted that logic is not the barometer for impetus or reason for user action at SO. Obviously. — guest271314, Apr 27 '17 at 18:38

Ousmane D. · Answer 1 · 2017-04-27T18:04:37.937

3

You'll probably want to use textContent to retrieve the text of the div.

sum += parseInt(items[i].textContent);

to retrieve the average simply, insert the code below after the for loop.

return sum / itemCount;

edited Apr 27 '17 at 18:04

answered Apr 27 '17 at 17:58

Ousmane D.

54,915
8
91
126

score 2 · Accepted Answer · answered Apr 27 '17 at 17:58

2

div's don't have a property called value (only inputs does). Use textContent instead. Change this:

sum += parseInt(items[i].value);

to this:

sum += parseInt(items[i].textContent);

answered Apr 27 '17 at 17:58

ibrahim mahrir

31,174
5
48
73

OP also asked for average of `sum` – guest271314 Apr 27 '17 at 18:04
@guest271314 I bet OP already knows how to calculate the average. – ibrahim mahrir Apr 27 '17 at 18:05

score 0 · Answer 3 · answered Apr 27 '17 at 18:00

Use .innerText instead of .value, and trim before use ;)

 sum += parseInt(items[i].innerText.trim());

function overallRating() {
  var items = document.getElementsByClassName("ratings");
  var itemCount = items.length;
  var sum = 0;

  for (var i = 0; i < itemCount; i++) {
    sum += parseInt(items[i].innerText.trim());
    console.log(sum)
  }
}

<div class="ratings">1</div>
<div class="ratings">5</div>
<div class="ratings">3</div>
<div class="ratings">2</div>
<input type='submit' onClick='overallRating(this)' />

Convert and add a collection of div values to Integers

3 Answers3