How do i add and get the total of all my expenses value in javascript-CodePudding

I dont know if am doing it wrongly, but i want to add all my expenses value, but instead of adding and giving me the sum of my value, it concatenate them together, how do i solve that?

html code: This is just a table for my list

                    <table>
                        <tr>
                            <th>Expenses Title</th>
                            <th>Expense Value</th>
                            <th></th>
                        </tr>
                        
                        <tr>
                            <td>egg</td>
                            <td >350</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>
                        <tr>
                            <td>Bread</td>
                            <td >340</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>
                        <tr>
                            <td>fish</td>
                            <td >90</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>

                    </table>

here is the function i coding to perform my task, but instead it concatenate my figures. Javascript code(vanilla Javascript) I'm a beginner i need a best approach for this. thank you.

let expense_value = document.getElementsByClassName("expenses_value");
let sum = 0
for(let i = 0; i < expense_value.length; i  ){
   let newVal = expense_value[i].innerHTML;
   sum = sum   newVal;
   console.log(sum)
}

any help or suggestions

CodePudding user response：

The innerHTML will provide the number as string to convert it back to number, you can make it start with , For Example expense_value[i].innerHTML or You can use Number().

let expense_value = document.getElementsByClassName("expenses_value");
let sum = 0
for(let i = 0; i < expense_value.length; i  ){
   let newVal =  expense_value[i].innerHTML;
   sum = sum   newVal;
}
console.log(sum)

                    <table>
                        <tr>
                            <th>Expenses Title</th>
                            <th>Expense Value</th>
                            <th></th>
                        </tr>
                        
                        <tr>
                            <td>egg</td>
                            <td >350</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>
                        <tr>
                            <td>Bread</td>
                            <td >340</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>
                        <tr>
                            <td>fish</td>
                            <td >90</td>
                            <td>Edit</td>
                            <td >Delete</td>
                        </tr>

                    </table>

CodePudding user response：

the variable newVal is of type string so it will by default cancatenate strings .Firstly, you need to change its type from String to Int thanks to " parseInt(newVal) "
you can change it here

let newVal = parseInt(expense_value[i].innerHTML);

or here

sum = sum   parseInt(newVal);