The jQuery object which represents the grid footer element.

Example - hightligh the cells within the footer of the grid

<div id="grid"></div>
<br />
<button id="btn" class='k-button'>Highlight footer row's cells</button>

<script>
  let encode = kendo.htmlEncode;
  $("#grid").kendoGrid({
    columns: [
      { field: "name" },
      { field: "age",
        footerTemplate: ({ age }) => `Min: ${encode(age.min)} Max: ${encode(age.max)}`
      }
    ],
    dataSource: {
      data: [
        { name: "Jane Doe", age: 30 },
        { name: "John Doe", age: 33 }
      ],
      aggregate: [
        { field: "age", aggregate: "min" },
        { field: "age", aggregate: "max" }
      ]
    }
  });

  $("#btn").click(function(e){
    var gridFooter = $("#grid").getKendoGrid().footer;
    var cells = gridFooter.find("td");
    cells.css("background-color", "#90EE90");
  });
</script>
In this article