title: Add a % sign and color it
body: <p>I have a datagrid column with numbers in it. How do I:</p>
  
  <pre><code>1. add a '%' sign at the end of each number in the column 
  </code></pre>
  
  <p>AND</p>
  
  <pre><code>2. make the color either red or green depending on if the number is less than or greater than 0, respectively. 
  </code></pre>
  
  <p>I've been able to do 1 or the other but not both. Here is what I have, which does #2 but not #1:</p>
  
  <pre><code>// my datagrid column:
  &lt;mx:AdvancedDataGridColumn dataField="change" itemRenderer="itemrenderers.ColorRenderer" /&gt;
  
  // my item renderer:
  package itemrenderers 
  {
  import mx.controls.Label;
  import mx.controls.dataGridClasses.DataGridListData;
  public class ColorRenderer extends Label {
      override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
      {
          super.updateDisplayList(unscaledWidth, unscaledHeight);
          if (data &amp;&amp; data[DataGridListData(listData).dataField] &lt; 0)
          {
              setStyle( "color", 0xA41330 ); //red
          }
          else
          {
              setStyle( "color", 0x59A336 ); //green
          }
      }
  }
  }
  </code></pre>