Changing color of form html with Javascript I have some custom HTML and CSS added to a form module I've created. It looks fine; the css is styling it correctly with a drupal_add_css() stylesheet. But I also want to add some Javascript using drupal_add_js() so that when a user is on the first page of the form it changes the text color in the HTML I set up. But I can't get it to work!

Here's the Javascript in step-one.js:

document.getElementById("step-one").style.color = "#769EDD";


Here's the code it will be changing:

    $form['progress bar'] = array(
        '#title' =&gt; t('Module Tool'),
        '#prefix' =&gt; '&lt;div class="progress-bar" id="progress-bar"&gt;
&lt;span id="step-one"&gt;Experience Level&lt;/span&gt; &lt;span id="arrow1"&gt; &gt; &lt;/span&gt;
&lt;span id="step-two"&gt;Primary Role&lt;/span&gt; &lt;span id="arrow2"&gt; &gt; &lt;/span&gt; 
&lt;span id="step-three"&gt;Topics of Interest&lt;/span&gt; &lt;span id="arrow3"&gt; &gt; &lt;/span&gt; 
&lt;span id="recommendations"&gt;Recommendations&lt;/span&gt;&lt;/div&gt;',
    );


And I'm trying to add the javascript call ABOVE the previous code, right after I do the drupal_add_css() call (which works). Note that this is all within my module_form() function. Here's the relevant code:

function modulename_form($form, &amp;$form_state) {
      drupal_add_css(drupal_get_path('module', 'modulename') .'/modulename.css');
      drupal_add_js(drupal_get_path('module', 'modulename') .'/step-one.js');
      // more code around building the form itself...until eventually 
      I get to my $form['progress bar'] = array( // see code above.


Any ideas why this might not be working?
You can try like this (thats's step-one.js file):

(function ($) {
  Drupal.behaviors.yourModule = {
    attach: function (context, settings) {
      $('#step-one').css('color', '#769edd');
    }
  };
})(jQuery);