I am working out of the book JavaScript and jQuery: The missing manual and attempting to complete the Chapter 2 exercises. I have completed my code but it's not working as expected and am asking for a code review (code listed below). My code is supposed to use JavaScript to highly portions of HTML text then use a rule I created for a class to style span items with this class as list items within the UL they're nested under in the HTML code. I have raked my brain on this code and need help figuring out why nothing is executing. Can you please help me debug this code? Did I make a mistake? Is something not linked properly? Any feedback would be helpful. Key Terms JAVASCRIPT & jQUERY: THE MISSING MANUAL Key Terms Add some Key Terms Add some key terms to this file by going into the HTML code and creating span tags in the text below. Each span should have a class of "kt", and should include one or two words of text. Vestibulum semper tincidunt sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec pulvinar, justo non fringilla dapibus, sapien tortor cursus erat, at posuere magna nisi tincidunt sapien. Sed nisl. Fusce venenatis, libero porta porta fringilla, sapien odio tincidunt sem, id aliquam tellus sapien sit amet quam. Vivamus justo mi, aliquam vitae, eleifend et, lobortis quis, eros. Ut felis arcu, mollis ut, interdum molestie, vehicula a, sapien. Quisque et quam non tortor ultrices rutrum. Nulla porttitor mauris sed nunc. Donec lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras quis massa. Sed mattis erat vitae nisi. Morbi dictum Donec at sapien non dolor tempor congue. Morbi dictum rutrum nisl. Curabitur tellus metus, pharetra vitae, tempus sit amet, semper ac, sapien. In hac habitasse platea dictumst. Mauris est velit, placerat eu, porta eget, aliquam in, dui. Nam mi quam, lobortis in, dictum vel, gravida et, sapien. Etiam mattis. Donec sed diam nec odio molestie iaculis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Morbi eu nibh. In hac habitasse platea dictumst. Integer posuere tellus. Fusce et justo ac sem sagittis consectetuer. Aliquam erat volutpat. Vivamus interdum ullamcorper felis. Vestibulum pulvinar. Integer ornare malesuada diam. Praesent sed est Integer lacus. Mauris condimentum scelerisque mauris. Nullam luctus. Vestibulum neque dolor, tempus quis, aliquam quis, mollis at, odio. Quisque in mi eu velit pretium commodo. Nullam fringilla mollis pede. Praesent eleifend tellus et tellus. Ut in sem. In aliquam dignissim mauris. Aenean ac magna blandit quam scelerisque accumsan. Sed suscipit odio at pede. In hac habitasse platea dictumst. Aenean sed tortor sit amet dui commodo tempus. Vestibulum sit amet arcu eu lectus scelerisque fermentum. Vivamus at arcu at est feugiat convallis. Fusce eu metus. Donec vel tellus eu massa ultrices ultricies. Cras dapibus tellus sed libero. Fusce et dolor. Key terms in this article nisi ut aliquip corporis suscipit qui dolorem fugiat quo
I am working out of the book JavaScript and jQuery: The missing manual and attempting to complete the Chapter 2 exercises. I have completed my code but it's not working as expected and am asking for a code review (code listed below).
My code is supposed to use JavaScript to highly portions of HTML text then use a rule I created for a class to style span items with this class as list items within the UL they're nested under in the HTML code. I have raked my brain on this code and need help figuring out why nothing is executing. Can you please help me debug this code? Did I make a mistake? Is something not linked properly? Any feedback would be helpful.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Key Terms</title>
<link href="_css/site.css" rel="stylesheet">
<script src="../key-terms/_js/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('span.kt').each(function() {
let keyTerms = $(this).clone();
$('.ktlist').append('<li>keyTerms</li>');
ktlist.addClass('keyTerms');
}); //end each
}); //end ready
</script>
</head>
<body>
<div class="wrapper">
<header>
JAVASCRIPT <span class="amp">&</span> jQUERY: THE MISSING MANUAL
</header>
<div class="content">
<main>
<h1>Key Terms</h1>
<h2>Add some Key Terms</h2>
<p>Add some key terms to this file by going into the HTML code and creating span tags in the text below. Each span should have a class of "kt", and should include one or two words of text.</p>
<p>Vestibulum semper tincidunt sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec pulvinar, justo non fringilla dapibus, sapien tortor cursus erat, at posuere magna nisi tincidunt sapien. Sed nisl. Fusce venenatis, libero porta porta fringilla, sapien odio tincidunt sem, id aliquam tellus sapien sit amet quam. Vivamus justo mi, aliquam vitae, eleifend et, lobortis quis, eros. Ut felis arcu, mollis ut, interdum molestie, vehicula a, sapien. Quisque et quam non tortor ultrices rutrum. Nulla porttitor mauris sed nunc. Donec lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras quis massa. Sed mattis erat vitae nisi.</p>
<h2>Morbi dictum</h2>
<p>Donec at sapien non dolor tempor congue. Morbi dictum rutrum nisl. Curabitur tellus metus, pharetra vitae, tempus sit amet, semper ac, sapien. In hac habitasse platea dictumst. Mauris est velit, placerat eu, porta eget, aliquam in, dui. Nam mi quam, lobortis in, dictum vel, gravida et, sapien. Etiam mattis. Donec sed diam nec odio molestie iaculis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Morbi eu nibh. In hac habitasse platea dictumst. Integer posuere tellus. Fusce et justo ac sem sagittis consectetuer. Aliquam erat volutpat. Vivamus interdum ullamcorper felis. Vestibulum pulvinar. Integer ornare malesuada diam.</p>
<h2>Praesent sed est</h2>
<p>Integer lacus. Mauris condimentum scelerisque mauris. Nullam luctus. Vestibulum neque dolor, tempus quis, aliquam quis, mollis at, odio. Quisque in mi eu velit pretium commodo. Nullam fringilla mollis pede. Praesent eleifend tellus et tellus. Ut in sem. In aliquam dignissim mauris. Aenean ac magna blandit quam scelerisque accumsan. Sed suscipit odio at pede. In hac habitasse platea dictumst. Aenean sed tortor sit amet dui commodo tempus. Vestibulum sit amet arcu eu lectus scelerisque fermentum. Vivamus at arcu at est feugiat convallis. Fusce eu metus. Donec vel tellus eu massa ultrices ultricies. Cras dapibus tellus sed libero. Fusce et dolor. </p>
</main>
<div id="key_terms">
<h2>Key terms in this article</h2>
<ul id="ktlist">
<span class=kt>nisi ut aliquip</span>
<span class=kt>corporis suscipit</span>
<span class=kt>qui dolorem</span>
<span class=kt>fugiat quo</span>
</ul>
</div>
</div>
Step by step
Solved in 3 steps with 1 images
