Changing an <a> tag with javascript

I need to change an anchor tag from this

<a href="#" id="masini">Mașini <i class="bi bi-caret-right"></i></a>

to this

<a href="#" id="masini">Mașini <i class="bi bi-caret-down"></i></a>

when the screen gets smaller. Basically to be responsive. I need to use javascript btw.

I tried the code bellow but it’s not working.

if(window.innerWidth < 1130px)
        {
            var replace = "Mașini"
            replace += "<i class="bi bi-caret-down"></i>";
            document.getElementById("masini").innerHTML = replace;
        }

>Solution :

It would help to do the following:

if (window.innerWidth < 1130) {
  document.getElementById("masini").className = "bi bi-caret-down";
}

<a href="#">Mașini <i id="masini" class="bi bi-caret-right"></i></a>