Problem with each()

Question

<script type="text/javascript">
    //<!--
$(document).ready(function() {

 $('ul.course-nav li a').each(function() {
  alert(5);
  if ('#' == $(this).attr('href')) {
   $(this).addClass('lessOpacity');
  }
 });

});    //-->
</script>

HTML of course contains searched elements:

  <ul class="course-nav">
   <li><a href="navigator.php?kam=zakladnyNahladKurzu&amp;id=1&amp;pos=2" class="next"><img src="css/images/16_arrow_right.png" alt="next"></a></li>

   <li><a href="#" class="prev"><img src="css/images/16_arrow_left.png" alt="prev"></a></li>
   <li><a href="navigator.php?kam=zakladnyNahladKurzu&amp;id=1" class="start"><img src="css/images/16_arrow_first.png" alt="start"></a></li>
  </ul>

Yet it doesn't work. Not even alerts pop up. Any suggestions?

Answer 1

You don't need each there, you can simply do:

$('ul.course-nav a[href="#"]').addClass('lessOpacity');

The jQuery's implicit iteration will look through all links whose href is set to # and add the class accordingly. Make sure to wrap your code in ready handler:

$(function(){
  $('ul.course-nav a[href="#"]').addClass('lessOpacity');
});

Answer 2

intead of

  $('ul.course-nav a').each(function() {
    alert(5);
    if ('#' == $(this).attr('href')) {
    $(this).addClass('lessOpacity');
   }
 });

replace with

 $('ul.course-nav li a').each(function() {
    alert(5);
    if ('#' == $(this).attr('href')) {
    $(this).addClass('lessOpacity');
   }
 });