Question

I append the following html:

<span sytle="color:#000000" />

The color value is stored in a variable:

var my_color = “#000000”;

var a = $(“#a”);

Below is what I have tried:

a.append('<span style="color: ' + my_color + '"</span>'); 

Is this correct?

Answer 1

You’re missing the closing bracket on the span element:

my_color + '"></span>
             ^

Because there’s no content within the span, are you sure that it’s failing? Appending a span to the #a element wont change the color of the text within #a. An alternative might be to use:

$('#a').css('color', my_color);

Also, _{just in case}, make sure your script is executing after the #a element has been added to the DOM, otherwise your selection will not be selecting any elements, and appending will fail.

You can simply wrap your code in a document.ready callback with the following code:

jQuery(function($){
  ...code here...
});