# Set the Colors for Alternating Grid Rows

## Environment

<table>
 <tr>
  <td>Product</td>
  <td>Progress® Kendo UI® Grid for jQuery</td>
 </tr>
 <tr>
  <td>Preferred Language</td>
  <td>JavaScript</td>
 </tr>
</table>

## Description

How can I customize the Excel document that the Data Grid generates during exporting?

## Solution

To set the background color of the alternating rows, the demo uses the [`background`](https://www.telerik.com/kendo-jquery-ui/documentation/api/ooxml/workbook/configuration/sheets/rows/cells#sheetsrowscellsbackground) option of the cell. For more information on how Excel documents work, refer to the [introductory help topic on Excel](https://www.telerik.com/kendo-jquery-ui/documentation/framework/excel/introduction#create-excel-document).

The following example demonstrates how to customize the Excel document that the Grid generates during exporting.

```dojo
<div id="grid"></div>
<script>
    $("#grid").kendoGrid({
        toolbar: ["excel"],
        excelExport: function(e) {
          var sheet = e.workbook.sheets[0];
          for (var rowIndex = 1; rowIndex < sheet.rows.length; rowIndex++) {
            if (rowIndex % 2 == 0) {
              var row = sheet.rows[rowIndex];
              for (var cellIndex = 0; cellIndex < row.cells.length; cellIndex ++) {
                row.cells[cellIndex].background = "#aabbcc";
              }
            }
          }
        },
        dataSource: {
          type: "odata-v4",
          transport: {
              read: "https://demos.telerik.com/service/v2/odata/Products"
          },
          pageSize: 7
        },
        pageable: true,
        columns: [
            { width: 300, field: "ProductName", title: "Product Name" },
            { width: 300, field: "UnitPrice", title: "Unit Price" },
            { field: "UnitsOnOrder", title: "Units On Order" },
            { field: "UnitsInStock", title: "Units In Stock" }
        ]
    });
</script>
```

## See Also

* [JavaScript API Reference of the Data Grid](https://www.telerik.com/kendo-jquery-ui/documentation/api/ui/grid)
* [jQuery Data Grid Overview (Demo)](https://demos.telerik.com/kendo-ui/grid/index)
* [Data Grid Overview (Documentation)](https://www.telerik.com/kendo-jquery-ui/documentation/controls/grid/overview)
* [Product Page of the jQuery Data Grid](https://www.telerik.com/kendo-jquery-ui/data-grid-\(table\))