I have one div with id='image' and background-image url, and I have 3 images with different src's- src='/some.jpg' and onmouseover='someFunction(this)'

I want when I put my mouse on one image to change div image to image that I put my mouse on.

I will leave function empty, I know I need to do document.getElementById ('image') and I tried a lot, with style.background-image and with variable, but obviously I'm doing something wrong

This is just one of many codes that I tried-

     <div id="image"> display here</div>
    
        <img
          class="preview"
          src="/img/tee1.jpg"
          alt="teaTime"
          onmouseover="upDate(this)"
          
        />
<img
          class="preview"
          src="/img/tee2.jpg"
          alt="teaTime2"
          onmouseover="upDate(this)"
          
        />
<img
          class="preview"
          src="/img/tee3.jpg"
          alt="teaTime3"
          onmouseover="upDate(this)"
          
        />
    #image {
      background-image: url("/img/tee3.jpg");
      background-color: bisque;
      width: 300px;
      height: 300px;
      border: 5px solid black;
     }
    function upDate(element) {
    
    
    }