Apply a css class to data item


I am trying to apply a tooltip, change to italic and change to bold when a mouseover occurs over a data item within a cell within 1 column. I do not want the data item to change if my pointer is in the cell unless the pointer is over the data item. So, it is not a cell attribute. It is a style I want to set on the data item. I have tried putting a <span tag around the data item
cell = new Element(“cell”);
cell.addContent("" + cellItem + “”);

with a title for tooltip and css class for the hover. But this does not work. Can’t seem to reference a css class

I tried setting attributes “title” and “style” but does not work. Does not seem to recogonize the css class and title does not work.
cell.setAttribute(“title”,“Click to open document”);

I tried the mouseover
cell.setAttribute(“onmouseover”, “function() { " +
“var cellValue = cellItem” +
“if (cellValue == “N” || cellValue == “Y”){ " +
"“hand”;” +
"“bold”;” +
"“italic”; " +
" cell.setAttribute(“title”,“Click to open document”);" +
“}” +
"} "
and it doesn’t work.
Any suggestions on how to apply a css class to a data item?
Thank You

You can apply css class to data item with class attribute of cell tag:

cell value

To apply changes you should use following css:
div.gridbox table.obj tr td.cellClass{

Hello Olga,

How can this be accomplished though using the API?
cell = new Element(“cell”);

I tried this for next line
cell.setAttribute(“cssClass”, “class=cellClass”);

Is there a css cell attirbute?

Thank You

I think you need to use
cell.setAttribute(“class”, “cellClass”);

Above attribute is no a normal css class, just a custom data storing attribute, so it need to be named with its natural name.