I am very new to JS I just created my very first web app but I am having trouble tidying up my code.

My HTML has 3 range sliders I take the value from each and change the color of the thumb depending on that value (RAG). It works fine the way I have implemented it but I have repeated myself quite a bit.

document.getElementById(complex).addEventListener("change", complexityFunction);
document.getElementById(uncert).addEventListener("change", uncertaintyFunction);
document.getElementById(repeat).addEventListener("change", repetitionFunction);

function complexityFunction() {
  var x = document.getElementById(complex).value;
  if (x == 1) {
      this.className = "green";
  } else if (x == 2) {
      this.className = "amber";
      } else {
          this.className = "red"
      }
  }

function uncertaintyFunction() {
  var x = document.getElementById(uncert).value;
  if (x == 1) {
      this.className = "green";
  } else if (x == 2) {
      this.className = "amber";
      } else {
          this.className = "red"
      }
  }

function repetitionFunction() {
var x = document.getElementById(repeat).value;
if (x == 1) {
    this.className = "green";
} else if (x == 2) {
    this.className = "amber";
    } else {
        this.className = "red"
    }
}

Here's what I have tried (amongst other things) which hasn't worked!:

document.getElementById(complex).addEventListener("change", assessmentFunction(complex));
document.getElementById(uncert).addEventListener("change", assessmentFunction(uncert));
document.getElementById(repeat).addEventListener("change", assessmentFunction(repeat));

function assessmentFunction(argument) {
  var x = document.getElementById(argument).value;
  if (x == 1) {
      this.className = "green";
  } else if (x == 2) {
      this.className = "amber";
      } else {
          this.className = "red"
      }
  }

Can somebody please help me out?