Instead, use querySelector() along with addEventListener().
Example
Following is the code −
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<link rel="stylesheet"
href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<body>
<select id="selectDemo">
<option value="Java">Java</option>
<option value="Javascript">Javascript</option>
<option value="MySQL">MySQL</option>
<option value="MongoDB">MongoDB</option>
</select>
</body>
<script>
document.querySelector('#selectDemo').addEventListener('change', subjectMarks);
function subjectMarks() {
console.log(58);
}
</script>
</html>To run the above program, save the file name anyName.html(index.html) and right click on the file. Select the option “Open with live server” in VS Code editor.
This will produce the following output −
Now, select the value from dropdown list −
Output
This will produce the following output −
