JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="poke-list"></ul>
    <div class="pagination">
        <button class="prev">Prev</button>
        <button class="next">Next</button>
    </div>

JavaScript

var next = $('.next');
    var prev = $('.prev');


    var getData = async function (url) {
        var response;
        return response = await $.get(url);
    };

    var showPokeInfo = function(data) {
        console.log(data);
        var types = data.types;
        var types2 = [];

        for (var i of types) {
            types2.push(i.type.name)
        }
        console.log(types2);

        $('body').append($(`<div>
                                <img src='${data.sprites.front_default}' alt="">
                                <p>${data.name}</p>
                                <p>${types2}</p>
                                <p>${data.height}</p>
                                <p>${data.weight}</p>
                            </div>`))
    };

    var appendContent = function (data) {
    
    $(next).unbind( "click" );
        var list = $('.poke-list');
        list.empty();

        var res = data;
        console.log(data);

        var pokemons = res.results;
        console.log(pokemons);

        pokemons.forEach(function (item) {
            list.append($(`<li>${item.name}</li>`))
        });

        prev.on('click', function (event) {

            res = data;
            var url2 = res.previous;
            if (url2 === undefined || url2 === null) {
                alert('Limit reached!');
                event.stopImmediatePropagation();
            } else {
                getData(url2)
                    .then(appendContent);
            }
        });

        next.on('click', function (event) {
alert()
            res = data;
            var url = res.next;
            if (url === undefined || url ===null) {
                alert('Limit reached!');
            } else {
                getData(url)
                    .then(appendContent)
                    .catch(e => {
                        alert('fsdf');
                    })
            }

        });

        $(list).on('click', 'li', function () {
        alert()
          ...