Как я могу показать количество товаров на значке карты покупок из javascript

Вы можете сделать это с помощью js, нацелившись на идентификатор вместо класса, и сделать это следующим образом:

var totalQty = 5;
var elementVar = document.getElementById("card-qty");
elementVar.setAttribute("value", totalQty);

Так вот это работает.

var totalQty = 5;
var elementVar = document.getElementById("card-qty");
elementVar.setAttribute("value", totalQty);

.badge:after {
  content: attr(value);
  font-size: 12px;
  color: #fff;
  background: red;
  border-radius: 50%;
  padding: 0 5px;
  position: relative;
  left: -8px;
  top: -10px;
  opacity: 0.9;
}

<i class = "fa badge fa-lg" id = "card-qty" value = "">&#xf07a;</i>

Обновлено: Если вы настроены на получение элементов по классу вместо идентификатора, вы можете использовать этот код js:

var totalQty = 5;
const elementVar = document.getElementsByClassName("badge");
let index = 0;


while (index < elementVar.length) {
  elementVar[index].setAttribute("value", totalQty);
  index++
}

Вот это работает:

var totalQty = 5;
const elementVar = document.getElementsByClassName("badge");
let index = 0;


while (index < elementVar.length) {
  elementVar[index].setAttribute("value", totalQty);
  index++
}

.badge:after {
  content: attr(value);
  font-size: 12px;
  color: #fff;
  background: red;
  border-radius: 50%;
  padding: 0 5px;
  position: relative;
  left: -8px;
  top: -10px;
  opacity: 0.9;
}

<i class = "fa badge fa-lg" id = "card-qty" value = "">&#xf07a;</i>