jQuery: Double click on a paragraph to toggle background color
jQuery Events : Exercise-5 with Solution
Double click on paragraph to toggle background color.
Sample Data :
HTML :
<body> <p>Double-click here to change the background color.</p> </body>
CSS Code:
p { background: blue; color: white; } p.dbl { background: yellow; color: black;> }
Solution:
HTML Code :
JavaScript Code :
Note : In jQuery stoggleClass( className ) method is used to add or remove one or more classes from each element in the set of matched elements. It has the following parameter.
- className : One or more class names (separated by spaces) to be toggled for each element in the matched set. [Type: String]
Live Demo:
Contribute your code and comments through Disqus.
Previous: Hide all headings on a page when they are clicked.
Next: Click a header to add another.
What is the difficulty level of this exercise?
Test your Programming skills with w3resource's quiz.
- Weekly Trends and Language Statistics
- Weekly Trends and Language Statistics