CSS Issues , HTML text not rendering properly

Question

I've loaded and parsed some xhtml in my DataManager class that is validated against the W3C strict dtd.I'm pushing certian bits of this into public arrays in my DataManager. My ContentManager, calls to the DataManager, and is returned a corresponding data set ,  instantiates a new GenericSection , and passes in the array as an argument in the constructor.
var targetData : Array = new Array();
targetData = DataManager.getInstance().returnAboutData();
var targ : String = targetData[0].toString();
var targFormat : String = targ.slice( ( targ.indexOf( '">' , 0 ) + 2 ) , ( targ.lastIndexOf( '/p>' , 0 ) - 3 ) );
var newSection : GenericContent = new GenericContent( targFormat );                   
newSection.publicId = ind;
contentContainer.addChild( newSection );
The output of formatTarg is :
The purpose of this site is to serve as an online portfolio and work reference. I am a 28 year old WEB/INTERACTIVE developer who has worked in the Los Angeles and Greater Orlando areas since 2004. I specialize in
  <span class="bulletText">ADOBE FLASH</span>
  <span class="bulletText">FLASH ANIMATION</span>
  <span class="bulletText">ACTIONSCRIPT 2.0/3.0</span>
  , and
  <span class="bulletText">ACTIONSCRIPT PROJECTS IN FLEX</span>
  . The client links listed above will provide several examples of media that I developed for the web. Please select the ACTIVE TEXT to the right of the PROJECT LINK heading in each section , if available ,  to view the site.
My GenericContent class i linked to a movieclip in the library , with one dynamic textfield, with the following settings :
instanceName : sectionText;
anti-aliasing : for readability;
embed : uppercase , lowercase , numerals , and puncutation
behavior : muliline
render as html : selected( true );
sectionText is declared as a public var in the GenericContent instance.
I have tried applying styles as such :
private var css                    :            StyleSheet;
private var cssDeclarations            :            String;
css = new StyleSheet();
var bulletText : Object = new Object(); 
bulletText .fontSize = 20; 
bulletText .fontWeight = "bold"; 
bulletText .color = "#336699"; 
bulletText .leading = 12;
css.setStyle( ".bulletText ", bulletText  );
sectionText.wordWrap = true;
sectionText.embedFonts = true;
sectionText.styleSheet = css;
sectionText.htmlText = contentText;
and
css = new StyleSheet();
cssDeclarations = ".bulletText{font-size:12px;color:#FFFF00"};
css.parseCSS(cssDeclarations);
sectionText.wordWrap = true;
sectionText.embedFonts = true;
sectionText.styleSheet = css;
sectionText.htmlText = contentText;
The html is not being rendered properly , the tags themselves do not show up , but no style is being applied. Any ideas , or perhaps a better approach ? thanks !

Answer 1

Upon further investigation i figured out what was wrong.
This property :
bulletText .fontWeight = "bold";
was causing my text to not render because bold character weren't used within the symbol associated with the class. By removing that and cleaning up the code a bit ,
var span : Object = new Object(); 
span.fontSize = 12; 
span.color = "#336699";
css = new StyleSheet();
css.setStyle( ".bulletText", span );
sectionText.styleSheet = css;           
sectionText.htmlText = contentText;
it rendered semi correctly , except with erronious line breaks , the solution for that was to , remove any instances of "/n" from the contentText string before setting the sectionText , done like this :
var pattern : RegExp = /\n/g;
contentText = contentText.replace( pattern , "" );
now it looks great !