New to Javascript. Trying to write a code for the hypotenuse of a triangle. Nothing happens when pressing submit in the DOM


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    
        <label id="aLabel">Side A:</label><br>
        <input type="text" id="aTextBox"><br>
        <label id="bLabel">Side B:</label><br>
        <input type="text" id="bTextBox"><br>
        <button type="button" id="submit">submit</button><br>    
        <label id="cLabel"></label><br> 
       
        <script src="index.js"></script>
  
</body>
</html>

let a; 
let b;

// Calculate the length of the hypotenuse using the Pythagorean theorem
document.getElementById("submit").onClick = function(){

    a = document.getElementById("aTextBox").value;
    a = Number(a)

    b = document.getElementById("bTextBox").value;
    b = Number(b);

    let c = Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2));

    
    document.getElementById("cLabel").innerHTML = c;

    console.log("The hypotenuse of the triangle is: " + c);
}

I believe I acquired all the ids in the DOM correctly and also imported the js file correctly(it is named index.js and in the same folder, in fact it auto populates when typing) I'm stumped, it should be a simple equation, but I don't know what I'm doing wrong or what alternatives to use. I really appreciate any coding help the community can give.

Solution

Change onClick to onclick

document.getElementById("submit").onclick = function(){

    a = document.getElementById("aTextBox").value;
    a = Number(a)

    b = document.getElementById("bTextBox").value;
    b = Number(b);

    let c = Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2));

    
    document.getElementById("cLabel").innerHTML = c;

    console.log("The hypotenuse of the triangle is: " + c);
}