title: how to change the color of an element on mouseover?
body: <p>I have a column of anchor tags, these have a class where a light blue color is define. </p>
  
  <p>I made function, so when the mouse is over on any of the anchor elements some image link to the anchor tag is shown. </p>
  
  <p>And now I would like to add to the anchor tag that is selected, a different color. So the user can see where in the column the image is linked. More for a reference to the user.</p>
  
  <p>I added a class to with the different color on the mouseover function, but that didn't work. So I would like to know if you have any suggestions how to solve this.</p>
  
  <p>I have a function for building the anchor tags and where I add the original color to them:</p>
  
  <pre><code>for (i=0; i&lt;numberOf; i++) {
          var param2Slider = document.createElement("a");
          param2Slider.id = 'sliderAnchor_'+i;
          sliderAnchorId = param2Slider.id;
          param2Slider.name = 'param2Slider';
          param2Slider.className = 'nav2Slider';
          document.getElementById('nav2Slider').appendChild(param2Slider);
      }
  </code></pre>
  
  <p>And my function with the mouseover action:</p>
  
  <pre><code>function navigator2Slider(flatParam, directionParam) {
  
  $('.nav2Slider').on('mouseover', function () {
      //$(this).attr('style').color='#29378F';
      nav2SliderName =  $(this).attr('id');
      nav2Id = nav2SliderName.split("_").pop();
      nav2Index = parseInt(nav2Id);
          $('#'+flatParam+'Stream').cycle(nav2Index);
          $('#'+directionParam+'Stream').cycle(nav2Index);            
  });
  </code></pre>
  
  <p>}</p>
  
  <p>I tried to add the new color on both functions, but my first problem is that even is added to the first anchor tag, the color is not displayed. And second, I want the color to be with the selected anchor tag, so I think it should be added on the mouserover function.</p>
  
  <p>Any suggestions are highly appreciated.</p>