Description: In this video, we start by creating a simple HTML page that contains an unordered list of items. The jQuery code will show how we can use 'each' and 'hover' to dynamically add and remove CSS classes as the user is hovering over the list items. The second part of the video demonstrates the use of 'this', 'eq', 'css', 'each', and 'append'. We start first by adding 4 divs on the page, then in the code we apply a css style to the third div. We then look at each div, and add a span for the even ones. We finally show how we can select the last div and modify its inner HTML.
Methodology: Using jQuery library.
Technologies: JavaScript, HTML, jQuery.
Examples constructed: In the first example, we add an unordered list of items to the body of the HTML page. Then we added a style for highlighting an element. The jQuery code will apply/remove the style as we hover in and out of the list items. The second example displays 4 divs on the page. The jQuery code applies some css to the third element. Then the code looks at each div and add to it a span when it is an even div.