Help - taking code out of jsfiddle and putting it into a html file

I did this project in jsfiddle a basic calculator and I wanted to put it in an html file outside of jsfiddle.
But when I do it doesn’t work but it works in jsfiddle.

script.js

$(document).ready(function);

function insert(){

var resultOld = $("#display").val();
var resultNew = resultOld + $(this).html();
$("#display").val(resultNew);

};

function del(){

var resultOld = $("#display").val();
var resultLength = resultOld.length;
var resultNew = resultOld.substring(0, resultLength - 1);

$("#display").val(resultNew);

};

function process(){

var resultOld = $("#display").val();

if (resultOld == "") {
    
    alert("Your screen is empty. Please type in an equation.");
    
} else {
    
    try {
        
        var resultEval = eval(resultOld);
        alert("The result is: " + resultEval);
        
    } catch(ex) {
        
        alert("Something is wrong. Error: " + ex);
        $("#display").val("");         
        
    }
    
}

};

function reset(){
$("#displaycalculator)").val("");
};

(".reset").click(reset); (".num, .op").click(insert);
("#delete").click(del); ("#process").click(process);

html

calculator
  <link href="css/style.css" rel="stylesheet" type="text/css">
  <script src="https://kit.fontawesome.com/d8519c9c55.js" crossorigin="anonymous"></script> 
    <script src="http://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
    <script src="js/script.js"></script>
<button class="num">1</button>
<button class="num">2</button>
<button class="reset">AC</button>
<button class="num">3</button>
<button class="num">4</button>
<button class="op">+</button>
<button class="num">5</button>
<button class="num">6</button>
<button class="op">-</button>
<button class="num">7</button>
<button class="num">8</button>
<button class="op">*</button>
<button class="num">9</button>
<button class="num">0</button>




<button class="op">/</button>

<button id="delete">Delete</button>
<button id="process">=</button>

css
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: ‘’;
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

/* OUR CODE STARTS HERE */

body {
font-family: Helvetica;
}

#calculator {
width:300px;
background-color: #eee;
border: 2px solid #333;
border-radius: 10px;
padding:10px;
text-align:center;
}

#display {
background-color:#424242;
color:#fff;
font-size:35px;
display:white;
width:245px;
height: 80px;
margin-left:auto;
margin-right:auto;
}

button {
width:80px;
padding-top: 10px;
padding-bottom: 10px;
font-size: 14px;
}

#process {
width: 122px;
background-color:orange;
color:#fff;
}

#delete {
width: 122px;
background-color: #657383;
color: white;

}

.op {

background-color: grey;
color: white;
}

.reset {
color: white;
background-color: grey;

}