I’m using an Icon in elementor to open up a menu. It’s a “+” and I’m just looking to have it roate 45° into an “X” when it’s clicked. If anyone is familiar how this could be accomplished in CSS / JScript would be much appreciated.

Thank you

I’ve tried the following CSS, but it only rotates when clicking down and holding. It also rotates the entire container in Elementor versus the Icon itself.

CSS

.rotate {
  transition: transform 0.3s ease;
}

.rotate:active {
  transform: rotate(45deg);
}