dynamically change value on input (javascript)

Question

The value of my input is supplemented with a variable from javascript. But this variable is changed, ie the dynamic is subtracted or added.

so this value in input is also changed, but only after refreshing the page.

I would like this value in the input to be also dynamically changed, at the same time when I change the value in the variable js.

<input id="kwota2" type="text" name="kwota2" disabled>

<script>
    document.getElementById("kwota2").value = localStorage.getItem('sumalist');
</script>

---

span .deleteitembasket changes the value of the js variable, which I pass to the input.

I've come up with a way to use a function that every time I press deleteitembasket I will overwrite the value in input , but I do not know how to create it, because I am a novice programmer. please help.

 $(document).on('click', '.deleteitembasket', function () {
    var nazwa = $(this).closest('.produkt').find('.nazwa').text();
    var cena = $(this).closest('.produkt').find('.cenaprzedmiotu').text();

    var suma = 0;
    var id = $(this).closest('.produkt').attr("id");
    var li = "<li data="+id+" class='produkt_w_koszyku'><b>" + nazwa + "</b> <span class='cena_w_koszyku'>" + cena + " zł</span><span style='float: right; margin-right: 30px;' class='deleteitembasket'><i class=\"fas fa-times\"></i></span></li>";

    var $ul = $(this).parents('ul');
    $(this).closest("li").remove();
    localStorage.setItem('itemlist', $ul.html());

    $("#koszyk .cena_w_koszyku").each(function () {
        suma += parseFloat($(this).text());
    });

    $("#cena span").text(suma.toFixed(2));
    localStorage.setItem('sumalist', suma.toFixed(2));
});

Answer 1

You can use the jQuery method .val() to change the input value dynamically, here is an example:

 $('#kwota2').val('Test'); $('.deleteitembasket').click(function() { $('#kwota2').val(''); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="kwota2" type="text" name="kwota2" disabled> <span class="deleteitembasket">Delete</span>