I'm attempting to use jQuery to change the main content area of my homepage when a nav link is clicked. I'm using .load() to do this, but the external html page I'm referencing simply won't load (nothing happens).
<div class="inner cover main-content">
<h1 class="cover-heading">A heading</h1>
<p class="lead">This is the best page of all time.</p>
Figured I'd answer my own question since it took hours to figure out something so trivial.
If you're loading jQuery locally, you must run the file using a local web server like MAMP rather than just "clicking" on it (e.g. loading the file in a browser).
jQuery won't load external files if they aren't served from some kind of web server.
If you check the console, you'll see an error that says something like:
MLHttpRequest cannot load file:///Users/yourname/filepath/index.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.