I want to sum up all the integers using js loop. In my given case correct answer is 6. How can i do this using Js?

 <span class="gap">1</span>
 <span class="gap">2</span>
 <span class="gap">1</span>
 <span class="gap">2</span>`

var arr = []
var sum = 0;
for (i = 0; i < arr.length; i++) {
    sum += arr[i];
}
console.log(sum);

i was trying to do it by above code but i am unable to add all the integers in the array...

First you should extract the values from HTML.

Then you should convert them to numbers and sum.

I wrote this assuming there are no other elements having class="gap"; otherwise, you should write the parent element selector instead of document.

let gapsElements = document.querySelectorAll('.gap');
let sum = 0;
for (i = 0; i < gapsElements.length; i++) {
    const gapValueInt = +gapsElements[i].innerText;  // the '+' before 'arr' will convert a string to number;
    sum += gapValueInt;  
}
console.log(sum);

I replaced prefixes to be more standart, and removed array var, as we don't need it.

If I understand your question, you can use Document.getElementsByClassName() to get the matching span(s) then iterate those and call parseInt() like,

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

var arr = document.getElementsByClassName("gap");
var sum = 0;
for (let i = 0; i < arr.length; i++) {
  sum += parseInt(arr[i].textContent);
}
console.log(sum);

<!-- language: lang-html -->

 <span class="gap">1</span>
 <span class="gap">2</span>
 <span class="gap">1</span>
 <span class="gap">2</span>

<!-- end snippet -->