Untitled

meu javascript
let valores = ['maçã', 'banana', 'cereja', '7'];

let label1 = document.querySelector('#label1');
let label2 = document.querySelector('#label2');
let label3 = document.querySelector('#label3');

label1 = valores[Math.round(Math.random()*3)];
label2 = valores[Math.round(Math.random()*3)];
label3 = valores[Math.round(Math.random()*3)];

function sorteio(bloco) {
    if(bloco == valores[0]){
      bloco = style.backgroundImage = "url('img/maca.png')";
    }if(bloco == valores[1]){
      bloco = style.backgroundImage = "url('img/banana.png')";
    }if (bloco == valores[2]) {
      bloco = style.backgroundImage = "url('img/cereja.png')";
    }else {
      bloco = style.backgroundImage = "url('img/sete.png')";
    }
}

meu html

<html>
  <head>
    <title>Sorteio</title>
    <script src="scripts.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="style.css">

  </head>
  <body>

    <div class="card c1">
      <img class="card-img" src="img/maquina.png">
      <div class="card-img-overlay">
        <a href="#">
          <div id="botaoSort">
          </div>
        </a>
        <div class="pai">
          <div class="sorteio" id="label1" onclick="sorteio('label1')"> </div>
          <div class="sorteio" id="label2" onclick="sorteio('label1')"> </div>
          <div class="sorteio" id="label3" onclick="sorteio('label1')"> </div>
        </div>

      </div>
    </div>
  </body>
</html>