How Can I set variable width with !importanat using JavaScript/jQuery

Question

Ia have a div named "#idDayNrCell". I want to get its width then do some calculations and apply it to another div called ".event". I am using bootstrap so i need to apply !important aswell. I am new to javascript/jquery.

I tried something like this. But it didn't wotk

$(document).ready(function(){

    var cellWDTstr = ($("#idDayNrCell").css("width")); //get width
    var cellWDT =  cellWDTstr.substr(0,cellWDTstr.length-2); //remove the "px" part
    console.log(cellWDT);

    var GunSayisi=2; //how long is the event (2 for example)

    // after tihs things get complicated for me
    // if the even is minimum 2 days i need a different width. calculated below
    var wdtEnAz2 = ((cellWDT-30)*GunSayisi + 30*(GunSayisi-1)).toString(); 
    console.log(wdtEnAz2);
    var setWdt = GunSayisi>1 ? wdtEnAz2 : calWdt;

    //after here it is expoerimental code which I am failed
    console.log(setWdt);
    setWdt+= 'px';
    console.log(setWdt);
    $(".event").style.setPsetProperty('width',setWdt,'important');


});

this is the html

Answer 1

Using ES6,

var width = "100px";

$(".event").attr('style', `width: ${width} !important`);

Answer 2

像这样添加：

         $('.event').attr('style', 'width: '+ setWdt +'  !important');

Answer 3

You can use css property from jquery, please find below code snippet :

$(".event").css( "width", function(  
setWtd ) {

return setWtd + '!Important';

});