Can you apply a different CSS class to a specific part of the label in the XML response? Currently, the label value is:
label: $( "name", this ).text() + ", " + ( $.trim( $( "countryName", this ).text() ) || "(unknown country)" ) + ", " + $( "countryCode", this ).text()
I am looking to assign a different CSS class only to $( "countryCode", this ).text() in order to make its font size smaller compared to the other parts (name and countryName).
Is there a way to achieve this?
success: function( xmlResponse ) {
var data = $( "geoname", xmlResponse ).map(function() {
return {
value: $( "name", this ).text()
,
label: $( "name", this ).text() + ", " +
( $.trim( $( "countryName", this ).text() ) || "(unknown country)" ) + ", " +
$( "countryCode", this ).text()
,
id: $( "geonameId", this ).text()
};
}).get();