How do I add jquery to a javascript file?

JavaScript
1

Here is the repository: https://github.com/UnschoolAcademy/Markup-Previewer
I’m just starting to wean myself off of codepen for all of my projects, and I’m really beginning to see how much I relied on it behind the scenes :confused: Right now I’m attempting the markup previewer on the front end libraries projects.
I am trying to just make simple test website right now to get used to sublime and github. Its just a website that says “this is really, really, really awesome” in red text. However, I want to test the jquery by making it so when you clicked on the text it alerted “Hello World”, but it doesn’t seem to be working.
I’m thinking the issue is somewhere in the head of my html file in these two lines:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="script.js" ></script>

Any advice is appreciated, thanks :+1:

2

I downloaded and ran this. It loads the jQuery correctly, but you need to use document/ready.

$(document).ready(function() {
	$("#text").click(function(){
		alert("Hello World!")
	})
})

Otherwise, you may be setting up that click handler before the text node has been created, meaning it gets attached to undefined instead of the DOM node you are trying to target.

Also, it is common practice to put the script/js at the bottom of the body section. That way your page can render without having to wait for JS to download and set up. The link/css are the in the right place, though.