jQuery: Click a header to add another
jQuery Events : Exercise-6 with Solution
Click a header to add another.
Sample Data :
HTML :
<h1>Click me to add another!</h1>
Solution:
HTML Code :
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<h1>Click me to add another!</h1>
</body>
</html>
JavaScript Code :
$("body").delegate( "h1", "click", function() {
$(this).after( "<h1>Another header!</h1>" );
});
Go to:
PREV : Double click on paragraph to toggle background color.
NEXT : Find the data passed with the on() method for each <p> element.
Live Demo:
See the Pen jquery-events-exercise-6 by w3resource (@w3resource) on CodePen.
Contribute your code and comments through Disqus.
What is the difficulty level of this exercise?
Test your Programming skills with w3resource's quiz.