Navigating the DOM

- [Instructor] Now we have our event handler in place.…Let's go ahead and write some code to advance the slide…to the next one.…Let's go back to our code.…And go into our click event.…Now plain JavaScript has a lotta great functions now…to help us maneuver through the DOM,…and the first thing I'm gonna do…is grab the current slide.…So current is going to be document.querySelector,…which lets you pass in tag name or class name or whatever…like you would use with jQuery or CSS,…and it will return one element.…So in this case,…the one element I wanna return is hp-slide.active,…and that is the current slide.…

And then I'm going to get the next element sibling.…So that's a great way to maneuver your way through the DOM.…I'm gonna say next equals current.nextElementSibling.…Now, if next is non-null,…so I'm gonna check this really quick, next.…And I know I could put in three equal signs and a null,…but I'm not going to do that, I'm sorry.…I started coding in 1988,…so this is just what you get.…If next, meaning there is something in there,…