title: JavaScript Functions: Grade Distributions
body: <p>I was wondering if someone could help me understand what I am doing wrong? Below I have posted the assignment question, my code, and then the result I am getting.</p>
  <p><a href="https://i.stack.imgur.com/d9y14.png" rel="nofollow noreferrer">Assignment</a></p>
  <p>Here is my code:</p>
  <p>function parseScores(scoresString) {</p>
  <p>// TODO: Compete the function
  let inString = scoresString.split();</p>
  <p>return inString;</p>
  <p>}</p>
  <p>function buildDistributionArray(scoresArray) {</p>
  <p>// TODO: Compete the function</p>
  <p>let x = 0;</p>
  <p>let distributeArray = new Array(5);</p>
  <p>distributeArray[0] = 0;</p>
  <p>distributeArray<a href="https://i.stack.imgur.com/d9y14.png" rel="nofollow noreferrer">1</a> = 0;</p>
  <p>distributeArray<a href="https://i.stack.imgur.com/yUCzw.png" rel="nofollow noreferrer">2</a> = 0;</p>
  <p>distributeArray<a href="https://i.stack.imgur.com/WRLob.png" rel="nofollow noreferrer">3</a> = 0;</p>
  <p>distributeArray[4] = 0;</p>
  <p>for(i = 0; i &lt; scoresArray.length; i++){</p>
  <pre><code>   if(scoresArray[i] &gt;= 90){
  
         distributeArray[0]++;
     }
  
     else if(scoresArray[i] &gt;= 80 &amp;&amp; scoresArray[i] &lt;= 89){
  
         distributeArray[1]++;
     }
  
     else if (scoresArray[i] &gt;= 70 &amp;&amp; scoresArray[i] &lt;= 79) {
         distributeArray[2]++;
     }
     else if(scoresArray[i] &gt;= 60 &amp;&amp; scoresArray[i] &lt;= 69){
         distributeArray[3]++;
     }
     else if(scoresArray[i] &lt;= 59 &amp;&amp; scoresArray[i] &gt;= 0) {
         distributeArray[4]++;
     }
     
     return distributeArray;
  </code></pre>
  <p>}</p>
  <p>}</p>
  <p>function setTableContent(userInput) {</p>
  <p>// TODO: Compete the function</p>
  <p>let myTable = document.getElementById(&quot;distributionTable&quot;);</p>
  <p>if(userInput.length &gt; 0) {</p>
  <pre><code>   let parsedScores = parseScores(userInput);
  
     let buildArray = buildDistributionArray(parsedScores);
     
     let row = myTable.insertRow(0);
  
     let row2 = myTable.insertRow(1);
  
     let row3 = myTable.insertRow(2);
     
     let cell1 = row2.insertCell(0);
  
     let cell2 = row2.insertCell(1);
  
     let cell3 = row2.insertCell(2);
  
     let cell4 = row2.insertCell(3);
  
     let cell5 = row2.insertCell(4);
     
     cell1.innerHTML = &quot;A&quot;;
  
     cell2.innerHTML = &quot;B&quot;;
  
     cell3.innerHTML = &quot;C&quot;;
  
     cell4.innerHTML = &quot;D&quot;;
  
     cell5.innerHTML = &quot;F&quot;;
     
     let graphValueArray = [];
     
     let occuranceArray = [];
     
     for(index = 0; index &lt; 5; index++){
         occuranceArray[index] = row3.insertCell(index);
         
         occuranceArray[index].innerHTML = buildArray[index];
         
         graphValueArray[index] = row.insertCell(index);
         
         let styleClass = &quot;bar&quot; + index;
         
         let heightValue = (buildArray[index] * 10) + &quot;px&quot;;
         
         graphValueArray[index].innerHTML = &quot;&lt;div style = 'height&quot; + heightValue + &quot;class = &quot; + styleClass + &quot;&gt;&lt;/div&gt;&quot;;
     }
     
  </code></pre>
  <p>}
  else {</p>
  <pre><code>   let emptyRow = myTable.insertRow(0);
  
     let emptyCell = emptyRow.insertCell(0);
  
      emptyCell.innerHTML = &quot;No graph to display&quot;;
  </code></pre>
  <p>}</p>
  <p>}</p>
  <pre><code>// The argument can be changed for testing purposes
  setTableContent(&quot;45 78 98 83 86 99 90 59&quot;);
  </code></pre>
  <p>my results:
  <a href="https://i.stack.imgur.com/yUCzw.png" rel="nofollow noreferrer">Result</a></p>
  <p>Here is my HTML</p>
  <p><a href="https://i.stack.imgur.com/WRLob.png" rel="nofollow noreferrer">HTML</a></p>