Vanilla JS: Button with if-statement only working once [closed]

I'm a bit new to JS, so bare with me. Im trying to create an if-statement to the onclick-function where the conditionals are:

• Is the object property still set to "' '", print out an error message such as "Please select Main Fruit" (ie. assign a value to the selected property)

Problem is that you can click the button once, and if the property does not have an assigned value, it returns the assigned string. But when you click the button again, nothing happens. I get it that the function in whole is "satisfied" when an if-statement is true, but howcome you can't click the button again?

Function looks like this:

const mixSmoothie = () => {
  
  if (mainFruit = "''") {
    document.getElementById('finishedSmoothie').innerHTML = "Please select a main fruit"
  } else if (mixer = "''") {
    document.getElementById('finishedSmoothie').innerHTML = "Please select a mixer"
  } else if (superBooster = "''") {
    document.getElementById('finishedSmoothie').innerHTML = "Please select a superbooster"
  } else {
    document.getElementById('finishedSmoothie').innerHTML = `A ${mainFruit.category} ${mainFruit.name} smoothie mixed with ${mixer.name} and spiced up with ${superBooster.name}.`
  }
}

I have declared the smoothie-object in the global scope further up and it looks like this:

let smoothie = {
  mainFruit: '',
  mixer: '',
  superBooster: ''
}

When you click a card that randomizes the value of mainFruit (as well as mixer and superbooster), the code looks like this:

const pickMainFruit = () => {
  mainFruit = randomSelector(mainFruits)

  document.getElementById('mainFruit').innerHTML = `${mainFruit.name}`

  smoothie.mainFruit = mainFruit.name
}

Is there something wrong with the if-statement that makes you unable to click the button more than once? Please halp!