Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

It says I did not complete steps 5-17 but it appears to working correctly using what ever example strings provided.

Did I do something wrong here?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <label for="textInput">Type Something:</label>
    <input type="text" id="text-input">
    <button id="check-btn">big ass button</button>
    <div id="result"></div>
    <script src="script.js"></script>

/* file: styles.css */

/* file: script.js */
const  textInput = document.getElementById('text-input');
const checkButton = document.getElementById('check-btn');
const resultDiv = document.getElementById('result');

let text = textInput.addEventListener('input', (e) => text =
checkButton.addEventListener('click', () => {
    if(text === undefined || text.length === 0) {
        alert("Please input a value")
    } else palindromeChecker(text)

const palindromeChecker = (str) => {
    let newStr = str.toUpperCase().match(/[a-zA-Z]/g).join('')
    let compStr = str.match(/[a-zA-Z]/g).reverse().join('').toUpperCase()

    if(newStr === compStr){
        resultDiv.innerText =`${str} is a palindrome`
        return resultDiv
    } else resultDiv.innerText = `${compStr} is a NOT palindrome`
        return resultDiv


Your browser information:

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

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

Hi! You’re already listening for the https to be clicked. Do you think you need to also listen for the input field? Look back at the calorie counter example for what to do with input fields.

Also, be sure to return the original strings in the return element.