JS не переключает картинку по клику c использованием относительного адреса

Не могу добиться чтоб картинка менялась по клику с помощью JS, точнее получается, но только если использовать абсолютный путь (http://127.0.0.1:5500/pics/Mobile_menu_icon.png таким образом получается, использую Live server), но проблема в том что при залитии на хостинг придется переписывать этот скрипт, как использовать относительный путь? Я уже все перепробовал(

HTML

<ul class="mobile_menu" id='mobileMenu'>
        <li><a href="">Скачать</a></li>
        <li><a href="">Тарифы</a></li>
        <li><a href="">Вход</a></li>
        <li><a href="">Регистрация</a></li>
    </ul>
<div><img src="pics/Mobile_menu_icon.png" alt="menu" class='mobile_icon' id="burgerIcon"></div>

CSS

img {
  display: block;
}
.mobile_icon{
  display: none;
}


@media screen and (max-width: 720px){
  .mobile_icon{
    position: relative;
    display: block;
    width: 50px;
    left: 25px;
    top: 20px;
  }


  .mobile_menu{ /* это другой div, выскакивает на мобильных на весь экран */
    display: none;
    position: absolute;
    margin: 0;
    padding: 0;
    background-color: white;
    width: 100%;
    height: 100%;
  }

  .show {
    display: block;
  }
}

JS

    let burger = document.getElementById('burgerIcon'); /*иконка которую надо поменять на крестик(вместо бургера)*/
    let menu = document.getElementById('mobileMenu'); /*открывает/закрывает меню ко клику на бургер*/
    
    let switchBurger = function() {
        document.getElementById("mobileMenu").classList.toggle("show");
        if (burger.src=='/pics/Mobile_menu_icon.png') {burger.src='/pics/Mobile_menu_icon_close.png'} else burger.src='/pics/Mobile_menu_icon.png'; /* и  вот тут собственно проблема - не работает так, burger.src возвращает абсолютный путь http://127.0.0.1:5500/pics/Mobile_menu_icon.png, но я хочу чтобы был относительный (иначе под каждый хостинг надо будет переделывать)*/
    };
    
    burger.onclick = switchBurger;