Add name to kendo ui network

After researching on the internet, I got a problem adding a header to my grid, so my code is:

.html file:

<div id="idGridTiposQuartos" class="gridtiposquartos js-var-grid-tipos-quartos"><div id="gridTiposQuartos"></div></div>

      

        
        
        
      

    

.js file:

$("#idBtnTiposQuarto").click(function()
    {
      $("#idGridTiposQuartos").fadeIn(1000);
      $("#idBtnQuartos").attr("disabled", false);
      $(".k-grid-toolbar", "#gridTiposQuartos").before("<h1>hello</h1>");
      $(".k-grid-toolbar", "#gridTiposQuartos").after("<h1>hello</h1>");

(some more code)

$("#gridTiposQuartos").kendoGrid({
        dataSource: dataSource,   
        pageable: 
        {
          messages: 
          {
            display: "{0} - {1} / {2} items", 
            empty: "0 items",
            page: "Page",
            of: "of {0}", //{0} is total amount of pages
            itemsPerPage: "items per page",
            first: "Go to the first page",
            previous: "Go to the previous page",
            next: "Go to the next page",
            last: "Go to the last page",
            refresh: "Refresh"
          }
        },

        serverPaging: true,
        height: 460,

        toolbar:[{name: "create",text: $varGridQuartosBtnNovoPT},{name: "close",text: "X"}],

        columns:[{ field:"Nome", title: "Nome" },{ field: "Preco", title:"Preço", format: "{0:c}", width: "100px" },

        {command:[{ name: "edit",text:{edit:$varGridQuartosBtnEditarPT,update:$varGridQuartosBtnActualizarPT,cancel:$varGridQuartosBtnCancelarPT}},{ name: "destroy",text:$varGridQuartosBtnApagarPT }],title:"&nbsp;",width: "230px"}],

         editable  : {mode : "popup",

           window : {title: "Editar",}
(the rest of the code)

      

        
        
        
      

    

I think I have posted the necessary code to show my problem, so my question is, what am I missing here? any help? thank.