title: How do I change the Background color of a Kendo UI for MVC grid cell
body: <p>I'm developing an app using Kendo UI for MVC and I want to be able to change the background of a cell but I don't know how to get the value of the column cell background property so I can set it.</p>
  
  <pre class="lang-razor prettyprint-override"><code> @(Html.Kendo().Grid(Model)
          .Name("LineItems")
          .Events(e=&gt; e
              .DataBound("LineItems_Databound")
          )
          .Columns(columns =&gt;
              {
                  columns.Bound(o =&gt; o.Ui).Title("UI").Width(20);
                  columns.Bound(o =&gt; o.QtyOrdered).Title("Qty Ord").Width(30);
                  columns.Bound(o =&gt; o.Nomenclature).Width(200);
                  columns.Bound(o =&gt; o.QtyShipped).Width(20).Title("Qty Sent");
                  columns.Bound(o =&gt; o.QtyReceived).Width(20).Title("Qty Rx");
                  columns.Bound(o =&gt; o.ReqID).Width(50);
                  columns.Bound(o =&gt; o.JCN_Job).Width(50).Title("Job/JCN");
                  columns.Bound(o =&gt; o.ManPartID).Width(100).Title("Part#");
                  columns.Bound(o =&gt; o.Requestor).Width(100).Title("Requestor");
              })
                       .ToolBar(toolbar =&gt;
                       {
                           //toolbar.Create();
                           toolbar.Save();
                       })
  
  
                  .Editable(editable =&gt; editable.Mode(GridEditMode.InCell))
                  .Sortable()
                  .Selectable()
                  .Resizable(resize =&gt; resize.Columns(true))
                  .Reorderable(reorder =&gt; reorder.Columns(true))
                  .DataSource(dataSource =&gt; dataSource
                      .Ajax()
                      .Model(model =&gt; model.Id(p =&gt; p.ID))
                      .Batch(true)
                      .ServerOperation(false)
                      .Read(read =&gt; read.Action("Editing_Read", "Shipping"))
                      .Update(update =&gt; update.Action("UpdateShipment", "Shipping"))
                      //.Destroy(update =&gt; update.Action("Editing_Destroy", "Shipping"))
                  )
  )
  </code></pre>
  
  <p>In my script I have code that loops through my grid on .databound </p>
  
  <pre class="lang-js prettyprint-override"><code> function LineItems_Databound() {
        var grid = $("#LineItems").data("kendoGrid");
        var data = grid.dataSource.data();
        $.each(data, function (i, row) {
            var qtyRx = row.QtyReceived;
            var qtySx = row.QtyShipped;
  
  
            if (qtyRx &lt; qtySx) {
               // Change the background color of QtyReceived here
            }
  
  
  
        });
     }
  </code></pre>