<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <title>Call Kinvey with AJAX and jQuery</title>
</head>
<body>
    <button id="loadPosts" onclick="callKinvey()">Load Posts from Kinvey</button>
    <script>
    function callKinvey() {
        $.ajax({
            method: "GET",
            url: "https://baas.kinvey.com/appdata/kid_BkUg26LS/posts",
            headers: { "Authorization": "Basic " + btoa("pena:pena")
            },

            //data: { … },
        success: function(data, status) {
            showPosts(data);
        },
        error: function(data, status) {
            $('body').append(JSON.stringify(data));
        }
    });

    }
        function showPosts(posts) {
            for (let p of posts) {
                $('body').append($('<div class="title">').text(p.title))
                $('body').append($('<div class="body">').text(p.body));
            }

        }

    </script>
</body>
</html>