How to insert a LI into a UL with Javascript?

Question

I’m looking to add a LI between two LI’s of a UL. I don’t have access to the CSS/HTML code of the website template, if it would not create easily, so I’m thinking about adding via html and javascript.

I’ve tried everything and I couldn’t, someone would have an idea of how to accomplish this?

wanted to insert this LI

<li>
    <a href="https://www.xyz.com.br/" title="XYZ">
        <img src="https://xyz.com.br/xyz.png" alt="xyz" width="200px">
    </a>
</li>

Follow the code...

<div class="atalhos-mobile visible-phone fundo-secundario borda-principal" style="background-color: rgb(255, 0, 128); border-bottom: 1px solid rgba(44, 43, 43, 0.18);">

<ul>

    <li class="menu-mobile-botao">
        <button type="button" class="navbar-toggle" data-toggle="slide-collapse" data-target="#slide-collapse" aria-expanded="false">
            <svg class="icone-menu" style="fill: rgb(255, 213, 65);">
                <use xlink:href="#icone-menu"></use>
            </svg>
        </button>
    </li>

    **//////////// QUERIA COLOCAR A LI AQUI ////////////////////////////**

    <li class="home-mobile">
        <a href="https://www.xyz.com.br/" class="">
            <svg class="icone-home" style="fill: rgb(255, 255, 255);">
                <use xlink:href="#icone-home"></use>
            </svg>
        </a>
    </li>

</ul>
</div>

Answer 1

1º Put an id in ul
<ul id="lista">

2º Use the function below in some example event

<button onclick="adicionar()">Adicionar linha</button>

function adicionarLi() {
  var lista  = document.getElementById("lista").innerHTML;
  lista = lista +"<li>"+seuTextoAqui+"</li>";
  document.getElementById("lista").innerHTML = lista;
}

Answer 2

I will try to help using such example

<h2>frutas</h2>

<input type="text" id="frutas" />

<button onclick="adicionar()">Adicionar frutas</button>

<br>

<ul id="lista">
  <li>banana</li>
  <li>morango</li>
  <li>manga</li>
  <li>uva</li>
</ul>

Now, the Javascript for the function add

function adicionar() {
  var fru = document.getElementById("frutas").value;
  var lista  = document.getElementById("lista").innerHTML;
  lista = lista +"<li>"+fru+"</li>";

  document.getElementById("lista").innerHTML = lista;
}