How to use my own CSS class in <a> in grid?

[Jay]

I'm trying to use my own CSS class to style an element in a grid cell, but Kendo's styles are overriding my class and not allowing my style. How do I use my own style in a grid cell?

[Iliana Dyankova]

Hi Jay,

You could set a custom CSS style for a particular element in a grid cell via template in the column. For example:  

$("#grid").kendoGrid({
  ...
  columns: [
    ...
    {field: "FieldName",
     title: "FieldName",
     template: "#= (FieldName== 'ConditionName') ? '<span class=\"customClass\">FieldName</span>' : FieldName#"}
  ]
});

For convenience I created a simple example which illustrates such approach in action - please find it attached. 

Kind regards,
Iliana Nikolova
the Telerik team