Kendo Web TabStrip - load grid into tab

Load Kendo Grid into Kendo Tabstrip using the Kendo Web framework.

HTML

<script src="http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.default.min.css">
<div class="container">
    <div class="compareTable">TABLE</div>
    <div id="tabstrip" class="kendoTabStrip">
        <ul>
            <li>Grid</li>
            <li>Tab 2</li>
            <li>Tab 3</li>
        </ul>
        <div class="tabSize">
            <div>bghsdgjdsb</div>
            <div id="grid"></div>
        </div>
        <div class="tabSize">
            <div id="tab2"></div>
        </div>
        <div class="tabSize">
            <div id="tab3"></div>
        </div>
    </div>
</div>

CSS

.kendoTabStrip {
    height:90%;
}
.compareTable {
    height:10%;
}
.tabSize {
    height:90% !important;
}
.container {
    position:absolute;
    height:100%;
    width:100%;
}

JavaScript

var tabstrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
tabstrip.select(0);

$("#grid").kendoGrid({
    columns: [{
        field: "FirstName",
        title: "First Name"
    }, {
        field: "LastName",
        title: "Last Name"
    }],
    dataSource: {
        data: [{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        },{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        }]
    }
});

$("#tab2").kendoGrid({
    columns: [{
        field: "FirstName",
        title: "First Name"
    }, {
        field: "LastName",
        title: "Last Name"
    }],
    dataSource: {
        data: [{
            FirstName: "Joe",
            LastName: "Smith"
        }, {
            FirstName: "Jane",
            LastName: "Smith"
        }]
    }
});

$("#tab3").kendoGrid({
    columns: [{
        field: "FirstName",
        title: "First Name"
    }, {
        field: "LastName",
        title: "Last Name"
    }],
   ...