Untitled

<!DOCTYPE html>
 <html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Kol 2 grupa 1</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="">
        <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    </head>
    <body>
        <input type="text" id="IsbnCode" placeholder="Enter your ISBN here:"/>
        <button type="button" id="AddBook">
                Add Book
        </button>
        <ol id="BooksList">
        </ol>
    </body>
    <script type="text/javascript">
    var book;
    var bookArray = [];
    $(document).ready( function(){
        $("#AddBook").on('click',function(){
            var isbn = $("#IsbnCode").val();
            if(isbn.length == 10 || isbn.length == 13)
            {
                var apiUrl = "https://openlibrary.org/api/books?bibkeys="+ isbn +"&jscmd=details&format=json";
                //Test ISBN: 9780605039070
                if(!bookArray.includes(isbn))
                    $.ajax({
                        type: 'GET',
                        url: apiUrl,
                        datatype: 'json'
                    }).always(function(data){
                        console.log(data);
                        book = data[isbn];
                        $("#BooksList").append("<li> <ul id="+isbn+">"+ book.details.title +" <li>"+ book.details.isbn_13 +"</li><li><img src="+ book.preview_url +"/></li><li>"+ book.info_url +"</li><ul></li>");
                        $("#"+isbn+" > li").hide();
                        $("#"+isbn).bind('click',function(){
                            $("#"+isbn+" > li").toggle();
                        });
                        bookArray.push(isbn);
                    });
            }
        });
    });
    </script>
</html>