jQuery를 사용하여 클래스와 함께 모든 요소의 총액 가져 오기

var res = {
  deposit: 0,
  withdrawal: 0,
  total: 0
};

function calculate(el) {
  return el.get().reduce(function(a, b) {
    return Number(a.textContent.replace(/,/g, "")) + Number(b.textContent)
  })
}

$(".deposit, .withdrawal").each(function(i, el) {
  res[$(el).data().type] += calculate($("span", el))
})

res.total = res.deposit - res.withdrawal;

$(".total span").html(res.total);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<div class="balance">
  <div class="heading">
    <p class="total" data-type="total"><span>00</span>
    </p>
  </div>
  <div class="instance withdrawal" data-type="withdrawal">
    <h3>Random</h3>
    <p>desc</p>
    <p class="amount">$<span>350</span><span>.00</span>
    </p>
  </div>
  <div class="instance deposit" data-type="deposit">
    <h3>Added in</h3>
    <p>desc</p>
    <p class="amount">$<span>1,250</span><span>.00</span>
    </p>
  </div>
  <div class="instance withdrawal" data-type="withdrawal">
    <h3>Bill</h3>
    <p>desc</p>
    <p class="amount">$<span>50</span><span>.00</span>
    </p>
  </div>
</div>
<!--end wallet-container left-->