Я хочу, чтобы кнопка like делала функцию многократного нажатия при многократном нажатии без обновления страницы

Я работаю над сетевым сайтом (типа twitter), используя django и javascript. Я хочу сделать кнопку like для каждого поста, которая при нажатии сохраняет в базе данных, что пользователю понравился пост и меняет внутреннее содержимое на('liked') и имя класса и наоборот. Проблема в том, что это работает, но только при первом нажатии на кнопку, а не несколько раз, и мне нужно обновить страницу, чтобы функция снова заработала. Проблема в коде javascript, но я добавлю html страницу и код python (views.py), чтобы сделать это более очевидным.

код javascript:

document.addEventListener('DOMContentLoaded',function(){
    window.addEventListener('load', function(){
    document.querySelector('#likesdiv').querySelectorAll('button').forEach(input =>{
    console.log('sl')
    let like__btn = true;
    if (input.value == 'like__btn'){
        like__btn = true;
        console.log('like')
    }
    else { 
        like__btn = false;
        console.log('liked')
    }
    
    input.addEventListener('click', function(){
        if (like__btn){
            console.log('clicked');
                console.log(input.id);
                fetch('/like/' + input.id , {
                method:'PUT',
                body: JSON.stringify({
                    like: true
                })
            })
                input.innerHTML = ' <span id="icon"><i class="fa-regular fa-thumbs-up"></i></span>liked'
                input.classList.remove('like__btn') 
                input.classList.add('liked__btn')
                input.value = 'liked__btn'
                console.log('changed')
        }
        else {
            console.log('clicked');
                console.log(input.id);
                fetch('/like/' + input.id , {
                method:'PUT',
                body: JSON.stringify({
                    notlike: true
                })})
                input.innerHTML = ' <span id="icon"><i class="fa-regular fa-thumbs-up"></i></span>like'
                input.classList.remove('liked__btn') 
                input.classList.add('like__btn')
                input.value = 'like__btn'
                console.log('unchan')
                
        }
    }
)})

})
})

в html-странице:

<div id="likesdiv">
{% if request.user in post.likers.all %}
<button value = "liked__btn"class="liked__btn" id={{post.id}}>
    <span id="icon"><i class="fa-regular fa-thumbs-up"></i></span>liked
        <span id="count">0</span> 
</button>
{% else %}
<button value = "like__btn" class="like__btn" id={{post.id}}>
    <span id="icon"><i class="fa-regular fa-thumbs-up"></i></span>like
        <span id="count">0</span> 
</button>
{% endif %}

</div>

в файле views.py:

def like(request, post_id):
    liked__post = posts.objects.get(id = post_id)
    if request.method == 'PUT':
        print('we\'ve hit put')

        data = json.loads(request.body)

        if data.get('like') is not None:
            print('in like')

            # Note: [User Obj Itself]
            #   follower = request.user  (is: <User Obj>)
            #   following = x            (is: <User Obj>)

            liked__post.likers.add(request.user)
 

        elif data.get('notlike') is not None:
            print('not in like')
            liked__post.likers.remove(request.user)

при первом нажатии на кнопку like или liked, она работает хорошо, но при повторном нажатии без обновления страницы она не работает, в чем проблема?

Вернуться на верх