Cambiar valor de css con javascript

[fermdp]

Hola, me gustaría si alguno de los genios del javascript y css me pudieran dar una mano... me estoy volviendo loco con algo que quiero hacer pero no logro, tengo un prototipo de unas listas ordenadas que pueden cambiar el orden de sus items arrastrando y soltando, todo funciona bien pero estoy en la etapa de dar mejor feedback al usuario final y quiero lograr que un valor de una clase cambie dinamicamente en base a un valor que tengo en una variable de javascript, mejor dicho a un valor que me da una función que cuenta cuantos items tengo seleccionados al presionar control o shift, si presiono estas teclas y voy haciendo click en los items de la lista estos cambian de color y puedo moverlos a la otra lista, esta funcion me da el valor de esa cantidad de items seleccionados y se usa para mostrar un budget con ese valor y yo tengo la idea de usarlo para tambien cambiar dinámicamente el alto del placeholder/dummy/hueco en donde se pueden soltar estos items. Si corren el ejemplo desde https://codepen.io/fermdp/pen/GGLvKw?editors=1001 van a entender rapidamente a que me refiero, al sellecionar y arrastrar se crea un "hueco" en donde soltar los items y este tiene un alto fijo dado por una clase, lo que quiero es poner el valor (la cantidad de items seleccionados) a multiplicar dicho valor en pixeles y así tener el hueco mas grande o mas chico en base a la cantidad de items seleccionados, pero no se como lograrlo. intente con innerHTML pero esto no puede cambiar directamente un valor de css. Les estaré muy agradecido si me pueden ayudar u orientar pues no doy con la solución!

Saludos desde Argentina!

[manuparquegiralda]

A ver, porque creo que no te he entendido bien. El valor de una clase CSS no se puede modificar en JavaScript, pero si puedes cambiar sus propiedades a través del atributo style.

Yo lo que haría es que cuando se selecciona un objeto, este almacenarlo en un array, luego recorrer el array e ir sumando las alturas de cada elemento seleccionado y aplicar esa altura al elemento

Código Javascript:

class MyApp {
    constructor() {
        this.els = {
            destino: documento.getElementById( "caja-destino" )
        };
 
        this.selecteds = [];
    }
 
    add( el ) {
        this.selecteds.push( el );
 
        this._setHeight();
    }
 
    this.remove( el ) {
         for(var i = 0; i < this.selecteds.length; i++ ) {
             if( el == this.selected[ i ] ) {
                 this.selecteds.slice( i, 1 );
             }
         }
 
         this._setHeight();
    }
 
    _setHeight() {
        var h = 0;
        for(var i = 0; i < this.selecteds.length; i++ ) {
            h += this.selecteds[ i ].offsetHeight;
        }
 
        this.els.destino.style.height = h + "px";
    }
}
 

Así a modo de ejemplo creo que esto sirve, un método que añade elementos seleccionados, uno que quita elementos seleccionados y otro que ajusta la altura de la caja de destino en función de los elementos que haya seleccionado. Cuando selecciones un elemento llamas al método add() y cuando se deseleccion al método remover().

No sé si van por ahí los tiros que necesitas.