Javascript not working when launch in chrome
-
Hi Everyone,
I have been learning web programming for the past year as a hobby and love NP++. However I have some issues with certain Javascript functions working and some that do not.
I am having real trouble in getting this particular function t run when launched in chrome. From research the coding looks correct but it just won’t work…can someone please give me some advise. I do not know if it a setting or a feature or a plugin that is not set in NP++.
Any help would be most appreciated…below is the code for the particular that does not work in NP++. I have many other pages to my site with javascript working fine but not this.
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
<meta name=“viewport” content=“width=device-width, initial-scale=1”>
<meta charset=“UTF-8”>
<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js”></script>
<script>
$(“#carQuestion span”).click(function(){
$(“#carQuestion span”).removeClass(‘correct’);
$(this).addClass(‘correct’);
});
</script>
<style>
.correct { color: red; }
span:hover { cursor: pointer; }
</style>
</head>
<body>
<p id=“carQuestion”>What Car is most like me?
<br><span class=“correct”>Ferrari</span>
<br><span>Limousine</span>
<br><span>SUV</span>
<br><span>Stationwagon</span>
</p>
</body>
</html> -
this is not a notepad++ issue, it is a javascript/jquery question.
The DOM element refrenced by
$("carQuestion span")is not yet defined when the script is run so the click method is not applied to any DOM element.You must either wrap your script with
$(document).ready(function(){ ... })or move your script tag to just before</body>
