[laimas]

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

Ну если этот код все что имеется, то тут как раз никакой логики и нет. А что это, для чего тоже не понятно. Но если, к примеру, такой вариант: есть элемент выбором и снятием выбора которого управляют две независимые кнопки, то в обработчиках этих кнопок должен быть вызов функции, которая и будет в цикле обрабатывать элементы "item-lining.active", то есть, сразу после выбора/снятия выбора.

У вас же есть обработчик щелчок по самим элементам, а значит логично, что этот щелчок и должен выбирать/снимать выбор, то есть первый щелчок - выбрали, второй - сняли выбор, третий - выбрали, и т.д.. И тут же получаем коллекцию выбранных элементов и делаем расчет:

$(здесь_селектор_ближайшего_общего_родителя_l_roof).on("click", ".item-lining", function() {
    
    var o = $(this), v = 0;
    
    //лучше не каждому элементу соседу класс указывать,
    //а родителю vars, так как через css можно обратиться к дочерним
    //если это нужно  
    //выбираем/снимаем выбор с элементов блока vars
    o.parent().toggleClass('active');
    
    if(o.parent().hasClass('active')) {
        //получаем соседние элементы, обходим циклом
        o.siblings().each(function() {
            //получаем нужный атрибут, складываем
            v += +this.dataset.elementId
        });        
        v += +o.data('element-id')
    }
  
    console.log(v)
    //Если нужно у все выбранных посчитать, то есть родительских выбранных блоков, 
    //то получить все vars.active, обходом их в цикле, получать дочерние элементы элементы ">div"
    //и уже обходом их в цикле получать у них значение атрибута и складывать 
});

Если же отмечать не родителя, а как прежде элемент и соседние элементы, то так:

o.add(o.siblings()).toggleClass('active');

вместо o.parent().toggleClass('active');, и получать все элементы ".item-lining.active" у общего родителя, а в обработчике это будет event.delegateTarget (в функции добавить аргумент function(event)), и обходить их сразу одним циклом.