Untitled

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <style>
      .active{
        text-decoration: underline;
        font-weight: bold;
      }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="javascript.js"></script>
    <script>
      $(document).ready(function(){
        var i = 1;
          $("li").click(function(){oznaci(this);});
  $("#dodaj").click(function(){
    var novi = document.createElement("li");
    novi.innerHTML = $("#novi_element").val();
    novi.classList.add("list-group-item");
    $(novi).click(function(){oznaci(this);});
    $("ul").append(novi);
    shrani();
  });

  $("#dodaj_v_tabelo").click(function(){
    var opravilo = $("#oznacen").val();
    var vtabelo = $("#nov_vnos").val();
    var novit = "<tr><td>" + i + "</td><td>" + vtabelo + "</td><td>" + opravilo + "</td><td>BLABLA</td></tr>";
    $("table tbody").append(novit);
    i = i+1;
  });
  $("#brisi_iz_tabele").click(function(){
    var opravilo = $("#oznacen").val();
    var vtabelo = $("#nov_vnos").val();
    var novit = "<tr><td>" + i + "</td><td>" + vtabelo + "</td><td>" + opravilo + "</td><td>BLABLA</td></tr>";
    $("table tbody").append(novit);
    i = i+1;
  });

  $("#brisi").click(function(){
    $(".active").remove();
    shrani();
  });
});
function oznaci(kliknjen){
  $(".active").removeClass("active");
  $(kliknjen).toggleClass("active");
  $(kliknjen).attr('id', 'oznacen');
  console.log("#oznacen").val();
}
    </script>
    <title></title>
  </head>
  <body>
    <div class="kategorije">
    <input type="text" name="kategorija" id="novi_element">
    <button type="button" id="dodaj">Dodaj</button>
    <button type="button" id="brisi">Briši</button> <br>
    <ul>
      <li class="list-group-item">Vaje</li>
      <li class="list-group-item">Treningi</li>
      <li class="list-group-item">Projekti</li>
    </ul>
    </div>
    <div class="tabela">
      <input type="text" name="kategorija" id="nov_vnos">
      <button type="button" id="dodaj_v_tabelo">Dodaj</button>
      <table>
        <thead>
        <tr>
          <th class="table-group-item">#</th>
          <th class="table-group-item">Opis</th>
          <th class="table-group-item">Kategorija</th>
          <th class="table-group-item">Datum vnosa</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
      </table>
      <button type="button" id="brisi-iz-tabele">Briši</button>
    </div>
  </body>
</html>