Switch CSS Style condition by enter a Number in a Textfield (Javascript?)

I absolutely need help from some smart people in this community!

I have created an analog clock in HTML and CSS and now want to make the hands of the clock movable using an input mask.

As an an example:

I enter the number 11 into the input mask for the hours. (11 pm). The CSS class ".hourhand" should now adjust the rotation accordingly (-30 degrees). Same for 1-12 with different rotation settings.

I have now worked with a lot of Javascripts for three days but never got a round result ... The code should also be as clean as possible. Maybe via if & else? I'm just an absolute javascript beginner ...

Many Thanks for your help!