Toggle the class 'highlight' when a paragraph is clicked.

 


<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

            $("p").click(function () {
                      $("p").toggleClass("highlight");     
            });
    

        });
    </script>
    <style>
      .selected { color:red; }
      .highlight { background:yellow; }
    </style>    
  </head>
  <body>
    <body>
      <p class="selected highlight">Hello</p>

    </body>
</html>

Related examples in the same category

1.	Change color for DIV
2.	Change submit button background and border
3.	Change background color
4.	Change border style and cursor
5.	Change CSS visibility to hide a tag
6.	Remove style class
7.	Looks for the class 'selected' on the matched elements.
8.	Remove the class 'highlight' from the matched elements.
9.	Remove two classes
10.	Remove all the classes from the matched elements.
11.	To access the background color of a clicked div.
12.	If the property name includes a "-", put it between quotation marks:

Toggle the class 'highlight' when a paragraph is clicked. : CSS « jQuery « JavaScript DHTML

Related examples in the same category