kendo calendar issue

by antouank

HTML

<script src="http://login.teamviewer.com/Scripts/kendo/2012.3.1315-debug/kendo.all.js"></script>
<link rel="stylesheet" href="https://dev-trunk.teamviewer.com//Content/kendo/2012.3.1315/kendo.common.css">
<link rel="stylesheet" href="https://dev-trunk.teamviewer.com//Content/kendo/2012.3.1315/kendo.metro.css">
<div id="background">
    <div id="calendar"></div>
</div>

CSS

.addA {
    background-color:red;
}
.addB {
    background-color:black;
}

JavaScript

$(document).ready(function () {

        var today = new Date(),
            events = [+new Date(today.getFullYear(), today.getMonth(), 8), +new Date(today.getFullYear(), today.getMonth(), 12), +new Date(today.getFullYear(), today.getMonth(), 24), +new Date(today.getFullYear(), today.getMonth() + 1, 6), +new Date(today.getFullYear(), today.getMonth() + 1, 7), +new Date(today.getFullYear(), today.getMonth() + 1, 25), +new Date(today.getFullYear(), today.getMonth() + 1, 27), +new Date(today.getFullYear(), today.getMonth() - 1, 3), +new Date(today.getFullYear(), today.getMonth() - 1, 5), +new Date(today.getFullYear(), today.getMonth() - 2, 22), +new Date(today.getFullYear(), today.getMonth() - 2, 27)];
        // create Calendar from div HTML element
        $("#calendar").kendoCalendar({
            value: today,
            dates: events,
            month: {
                // template for dates in month view
                content: '# if ($.inArray(+data.date, data.dates) != -1) { #' +
                    '<div class="' +
                    '# if (data.value < 10) { #' +
                    "autohide-false" +
                    '# } else if ( data.value < 20 ) { #' +
                    "autohide-false" +
                    '# } else { #' +
                    "autohide-false" +
                    '# } #' +
                    '">#= data.value #</div>' +
                    '# } else { #' +
                    '#= data.value #' +
                    '# } #'
            },
            footer: false,
            change: function(a,b,c){
                debugger;
            }
        });


        //tooltip code
        $(".autohide-false").kendoTooltip({
            autoHide: false,
            position: "top",
            content: '<div style="padding:15px; background-color:#fff;"><span class="header1">Select Type</span><br><br><button class="k-button">Set as A</button><div><br><button class="k-button">Set as B</button><div>'
        });

    });