Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

My code is not activating the console.log command when I click the button. I cannot find the issue myself. I have looked at other examples posted in the forums and examples in JS documentation online with no luck. I can’t find the issue.

Your code so far

<!-- file: index.html -->
<input id="text-input">
<button id="check-btn">Check</button>
<div id="result"></div>
/* file: styles.css */

/* file: script.js */
const checkButton = document.getElementById("check-btn");
const textInput = document.getElementById("text-input");
checkButton.addEventListener("click",()=>{
  console.log("Clicking the Button");
});

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

Can you post all your code? I don’t see a reference to the script file in your html.

Sorry, it looked like it was attaching all of my code when I created the post. I don’t have much I was just trying to get the basics going.

HTML

<input id="text-input">
<button id="check-btn">Check</button>
<div id="result"></div>

JS

const checkButton = document.getElementById("check-btn");
const textInput = document.getElementById("text-input");
checkButton.addEventListener("click",() => {
  console.log("Button Pressed");
});

As @hbar1st said, your HTML document needs to reference the script.js file via a script element. Otherwise, your script won’t load or execute.

Also, it’s always a good idea to start off with an HTML boilerplate, so that your document is properly structured. You should have a DOCTYPE declaration, and an html element, containing head and body elements (with the standard meta, link etc elements in the head).

Thanks, I knew it was going to be something really dumb…