Dynamic style and class name of element

I am working on dynamic style change according to element calss.
I tried like below. but It look like it is not rendered again with new class from template helpers.
I thought if an element gets new class, it search css and take styles matched with its class name.

sideNavi .focused{
  color: #333;

<div class = "sideNavi {{ checkFocused}}" >  </div>

  checkFocused: () => 'focused',

Is it wrong? Should I use other solution?

I already found some other soutions, like below.

we can use jquery or javascript like getElementsByClassName method and style.display property etc.