JSFiddle - React, Tailwind, and code Playground

HTML

<div class="greenbox"></div>

<button class="button1">change1</button>
<button class="button2">change2</button>

CSS

.greenbox {
    width: 100px;
    height: 100px;
    background: green;
}

JavaScript

var property1 = "width";
var property2 = "border-top";


$('.button1').on("click", function(){
    $('.greenbox').css(property1, "200px");
}); // WORKS

$('.button2').on("click", function(){
    $('.greenbox').css({
        property1: "50px",
        property2: "50px"
    });
}); // NOPE!