Telephone Number problem

JavaScript
1 
const phoneNumber = document.getElementById('user-input');
const checkBtn = document.getElementById('check-btn');
const clearBtn = document.getElementById('clear-btn');
const result = document.getElementById('results-div');

const valid1 = /1 \d{3}-\d{3}-\d{4}/;
const valid2 = /1 \(\d{3}\) \d{3}-\d{4}/;
const valid3 = /1\(\d{3}\)\d{3}-\d{4}/;
const valid4 = /1 \d{3} \d{3} \d{4}/;
const valid5 = /^\d{10}$/;
const valid6 = /\d{3}-\d{3}-\d{4}/;
const valid7 = /\(\d{3}\)\d{3}-\d{4}/;

const validList = [valid1, valid2, valid3, valid4, valid5, valid6, valid7]

function isValid(msg) {
  validList.some((regex) => regex.test(msg));
}

function handleClick() {
  if (phoneNumber.value === "") {
    alert("Please provide a phone number");
    return;
  }

  result.innerText += isValid(phoneNumber.value)
    ? `Valid US number: ${phoneNumber.value}`
    : `Invalid US number: ${phoneNumber.value}`;
    
  phoneNumber.value = "";
}

function clearInput() {
  result.textContent = "" 
}

checkBtn.addEventListener("click", handleClick)
clearBtn.addEventListener("click", clearInput)

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="styles.css" />
    <title>Telephone Number Validator</title>
</head>
  <body>
    <h1>Telephone Number Validator</h1>
    <form>
      <label for='user-input'>Check Phone Number</label>
      <input id='user-input' type='text' >
      <button id='check-btn'>Check</button>
      <button id='clear-btn'>Clear</button>
    </form>
    <div id='results-div'>
      <script src="script.js"></script>
  </body>
  </html>

When I input a number it is always coming up as invalid. I think I made a mistake somewhere but I just can’t spot it :frowning:

2

Can you talk about how these work? Regex is hard to debug

3

Thanks for the response but I found the problem was not returning my valid list…

4

Ah, yeah. Not returning the result of the call to .some() here would do it. Easy thing to accidentally overlook.