Home/ Questions/Q 6541677
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T11:08:02+00:00

I have the following css and jquery code to attempt to change the text

  • 0

I have the following css and jquery code to attempt to change the text colour upon click of the text in the ul. If the current text colour is #d49a9a, I want to change it back to #c2c0c0 and vice versa.

.navContainer ul{
    left: 10px;
    top:  20px;
    position: absolute;
    color: #c2c0c0;
    font-family: 'Terminal Dosis';
    font-weight: 200;
    font-size: 20pt;
    list-style-type: none;
    line-height: 50px;
}
.navContainer a {
    text-decoration: none;
    color: #c2c0c0;
}
.navContainer {
    left: 150px;
    top: 150px;
    position: absolute;
}

Edit — Here is my html

<head>
...some code
<script type="text/javascript">
            $("#navContainer li").click( function() { 
              $("#navContainer li").css("color", "#d49a9a");
              $(this).css("color", "#c2c0c0");
            });
            </script>
</head>
<div class="navContainer">
            <ul>
                <li class="navText">Work</li>
                <li class="navText"><a href="#">Blog</a></li>
                <li class="navText">About</li>
                <li class="navText">Contact</li>
            </ul>
        </div>

Please can you tell me what I am doing wrong.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ok I see what’s happening. Originally you had the wrong tag but at present you need to use $(".navContainer li") instead of $("#navContainer li") because navContainer is a class and not an id. I’ve thrown a demo together which should get you going.

    http://jsfiddle.net/nHJvz/1/

    • 0