To begin debugging your code, you will need to add a breakpoint. A breakpoint is a temporary flag set in the source code which indicates to the browser to pause the execution of the script to then await further instructions by the developer. To set a breakpoint, all you have to do is to navigate to the Source panel and go into your loaded code file. In there, you will have the line number available on the left-hand side which will permit you to right-click on it to open up a number of options:

On the selected line number, you can add a breakpoint (indicated in blue), which can also be conditional (indicated in orange):

While the focus here is on debugging the script, you can freely also add breakpoints on to your DOM in the Elements panel when right-clicking on it as per the screenshot. This will allow you to break the execution of the code when DOMs are changing, which can be essential when debugging interactivity: