buy a function

<!DOCTYPE html>
<html>
<head>
    <title>About.</title>

    <style>
            body{
                background-color: paleturquoise;
                }

    ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: turquoise;
  position: fixed;
  top: 0;
  width: 100%;
}

    li {
  float: left;
}

    li a {
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

    li a:hover:not(.active) {
  background-color: teal;
}


</style>

</head>
<body>
    <ul>
        <li><a href="aboutmypage.html">Purchase a function</a></li>
        <li><a href="mypagen8.html">Home</a></li>
        <li><a href="aboutmypage.html">About</a></li>
        <li><a href="https://pastebin.com/">Pastebin</a></li>
    </ul>

        <br><br><br>
        <h1>Buy your very own function HERE!<h1>

        <h4>put the name of the function below<h4>

        <textarea rows="4" cols="40" id="mysubmit"></textarea><br>

        <script>


            function submission (){
                let funcname = document.getElementById("mysubmit").value;
                let confirmation = confirm("Are you sure that you would like to purchase a function that is named " + funcname + "?");
                if(confirmation === true){
                    let debit = confirm("Would you like to pay with debit?");
                    if(debit === true){
                        let id = prompt("Please enter your debit CVC:", "")

                            let complete = confirm("You are about to purchase the function " + funcname + "for $125 with the debit CVC " + id + ". Are you sure you wish to do this?")
                            if(complete === true){
                                alert("Thank you for purchasing a function. it will arrive within a week.")

                        }
                    }
                }

            }
        </script>

        <button id="submitter" onclick="submission()">submit</button>


</body>
</html>