How to style 4 grids in a page when my pages have more than 4 grids?

See more:

ASP.NET

Javascript

CSS

jQuery

CSS3

My pages have 6 grids called grid1,grid2,grid3,grid4,grid5,grid6.When I click the search button,I read the data in grids.now I want to style the grid1,grid2,grid4,grid5 with style `"color:red"`,I can style them using these codes:

#grid1.k-grid-content td {
color:red
}
#grid2.k-grid-content td {
color:red
}
#grid4.k-grid-content td {
color:red
}
#grid5.k-grid-content td {
color:red
}

I think this way is really complicated and redundant and change the codes like this and click the search button,but failed.But if I firstly seach data,and then execute the change code,it successed. I found that my changes codes failed because at first I have not clicked the "Search" button and the grid do not have any data(the grid have not any "td" to color red).How to change my code?I just do not want to write complicated and redundant codes.Can it be used with jquery "on" event?Anybody use "on" to style the grid td?

.GridColor {
      color:red
      }
        $(function () {
       $("#grid1.k-grid-content  td").addClass("GridColor");
       $("#grid2.k-grid-content  td").addClass("GridColor");
       $("#grid4.k-grid-content  td").addClass("GridColor");
       $("#grid5.k-grid-content  td").addClass("GridColor");
        }