how to add the sum of numbers in array iteration using laravel or javascript or jquery?

adding the sum of numbers in array iterationtried using javascript but didnt succeed

@extends('layouts.master')@section('content')<!-- Content Wrapper. Contains page content --> <div class="content-wrapper"> <!-- Content Header (Page header) --> <div class="content-header"> <div class="container-fluid"> <div class="row mb-2"> <div class="col-sm-6"> </div><!-- /.col --> <div class="col-sm-6"> <ol class="breadcrumb float-sm-right"> <li class="breadcrumb-item"><a href="#">Home</a></li> <li class="breadcrumb-item active">Timesheets</li> </ol> </div><!-- /.col --> </div><!-- /.row --> </div><!-- /.container-fluid --> </div> <!-- /.content-header --> <!-- Main content --> <section class="content"> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <div class="card"> <div class="card-header"> <h5 class="card-title">Timesheets</h5> <div class="card-tools"> <button type="button" class="btn btn-tool" data-widget="collapse"> <i class="fa fa-minus"></i> </button> </div> </div> <!-- /.card-header --> <div class="card-body"> @include('layouts._messages') <div class="row"> <div class="col-md-12"> <table class="table table-striped" id="timesheets-table"> <thead> <tr> <th>Id</th> <th>Date</th> <th>Staff Name</th> <th>Department</th> <th> <a href="#" data-toggle="tooltip" title="">  </a> </th> <th> <a href="#" data-toggle="tooltip" title="">  </a> </th> <th> <a href="#" data-toggle="tooltip" title="">  </a> </th> <th> <a href="#" data-toggle="tooltip" title="">  </a> </th> <th>Total Hours</th> <th> <input type="checkbox" name="acs" value="Approve All" style="display:none">Approve All <th> <input type="button" onclick='selectAll()' value="Approve All" class="bg-success text-white"/> <input type="button" onclick='UnSelectAll()' value="Unselect All" class="bg-danger"/> </th> </th> </tr> </thead> <tbody> @foreach($timesheets as $timesheet) <tr> <td>  </td> <td>  </td> <td>   </td> <td>  () </td> <td class="proj" name="acs" > <strong> HRS</strong> </td> <td class="proj" name="acs" > @if(@$timesheet->hour1 == 0) - @else <strong> HRS</strong> @endif </td> <td class="proj" name="acs" > @if(@$timesheet->hour2 == 0) - @else <strong> HRS</strong> @endif </td> <td class="proj" name="acs" > @if(@$timesheet->hour3 == 0) - @else <strong> HRS</strong> @endif </td> <td class="proj bg-success text-white" > <strong class="text-lg">  </strong> </td> <td> <input type="checkbox" name="acs"> Approve </td> </tr> <?php ?> @endforeach <div class="mx-auto">  </div> </tbody> <tfoot> <tr> <td class="bg-danger"><strong>Total:</strong></td> </tr> </tfoot> </table> <input type="button" value="Get Selected" onclick="GetSelected()" /> <br / </div> @endsection

via Chebli Mohamed