Need help with JS team

Discuss
#1

Good day to all. why is the code not working?

document.getElementById("optionwidth3a").onclick = "SetSizeSelected(this,'m')";

source

<div id="optionwidth3a"
onmouseover="SetSizeHigh(this,'l')" 
onmouseout="SetSizeLow(this,'l')" onclick="SetSizeSelected(this,'l')" style="background-color: rgb(100, 79, 123); border-color: rgb(89, 65, 111);">
  Med.
  </div>
```
#2

May be you could ref this…

#3

I don’t understand anything anymore. my head is already smoking

<div id="textsize1">
  <input type="hidden" id="font_size" name="font_size" value="l">

  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'t')" onmouseout="SetSizeLow(this,'t')" onclick="SetSizeSelected(this,'t')">
  Tiny
  </div>
  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'s')" onmouseout="SetSizeLow(this,'s')" onclick="SetSizeSelected(this,'s')" style="background-color: rgb(75, 75, 75); border-color: rgb(56, 56, 56);">
  Mini
  </div>
  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'m')" onmouseout="SetSizeLow(this,'m')" onclick="SetSizeSelected(this,'m')" style="background-color: rgb(75, 75, 75); border-color: rgb(56, 56, 56);">
  Small
  </div>
  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'l')" onmouseout="SetSizeLow(this,'l')" onclick="SetSizeSelected(this,'l')" style="background-color: rgb(75, 75, 75); border-color: rgb(56, 56, 56);">
  Med.
  </div>
  <div id="optionwidth3a_default" onmouseover="SetSizeHigh(this,'x')" onmouseout="SetSizeLow(this,'x')" onclick="SetSizeSelected(this,'x')">
  Large
  </div>
  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'xl1')" onmouseout="SetSizeLow(this,'xl1')" onclick="SetSizeSelected(this,'xl1')">
  XL
  </div>
  <div id="optionwidth3a" onmouseover="SetSizeHigh(this,'xl2')" onmouseout="SetSizeLow(this,'xl2')" onclick="SetSizeSelected(this,'xl2')">
  XXL
  </div>
</div>

this is not background code. I need to click

onclick=“SetSizeSelected(this,‘xl2’)”