SixStringsCoder {6}

This is an important lesson since we will learn about the 'event' object and its 'target' to help us add another feature to our quote rotator. These two, in general, will help us to home in on more parts of a webpage adding more functionality for the user.

We will look at another method that collects similar elements on the DOM called `querySelectorAll`. This method provides more flexibility to get multiple elements by tag name, class name or CSS selector.

Let's continue accessing and manipulating multiple HTML elements but now focusing on the method getElementsByClassName which will allow us to access all elements which have the same class. We'll also get more practice with the for and for of loops.

In this lesson we will focus on creating, accessing and manipulating multiple HTML elements such as all p elements or all li elements using the method getElementsByTagName. We'll also get some practice using JavaScript's for and for of loops.

Let's start to build a reference or a Toolbox that we can access whenever we need to recall the various methods, properties and event types available to us in JavaScript.

In exercise 5, you'll create a collapsible drawer by restyling an element with classList toggle.

In exercise 4, you'll create the animation for revealing an answer for a quiz/game using JS and CSS.

In exercise 3, you'll build a side navigation menu that toggles between showing and hiding on the right side of the webpage.

In exercise 2, we'll continue to practice using textContent, classList and the contains() method plus we'll also look at a new property called className. We'll use those while practicing more conditional logic to toggle between two icons from the Font Awesome library and the Google Material Icons library.

In exercise 1, we'll continue to practice the classList methods add(), remove(), as well as explore what the toggle() and contains() methods do.

In this lesson, we'll look at a more concise way to change an element's styling by adding and removing classes with JavaScript.

In this exercise, you will practice how to set the brightness effect on the image then how to incrementally raise and lower the brightness effect.

We'll add some border properties to the image to help enhance it.

Let's add more filter effects - Brightness - Grayscale - Sepia.

In this lesson we are going to explore using the filter property to creatively change an image. We will still get lots of practice with the CAMEL sequence plus further hone our skills making event handler functions.

Let's work with a property called textContent so we can get and set the text of an HTML element plus use the Window object's method called .setInterval() to allow for continuous play..

Let's use a method of the window object .setTimeout()to show all the shapes in a continuous sequence..

Let's add more shapes to the webpage while focusing on CAMEL and utilizing the new method .querySelector().

We will continue to work with the CAMEL sequence but with two new JavaScript items, the document method .querySelector() and the property textContent.

Add a feature that adjusts the text size and add limits to how small and large a user can make the text.

Get more practice making a Day and Night mode feature.

Get more practice adding buttons to control the style of an element.

Get more practice with CAMEL using buttons and click events.

I'll show you a work sequence called CAMEL that I use to change a website based on user interaction or events.

This blog and these lessons will focus on using JavaScript to create things you can see and interact with!