Why does this javascript run locally but not on a web server?
<p>I have the following Javascript/jQuery on my page:</p>

<pre><code>&lt;script&gt;
 $("#mymarkdown").load("./LPInfo.md");
 var md = markdown.toHTML($("#mymarkdown").html());
 $("#mymarkdown").html(md);
&lt;/script&gt;
</code></pre>

<p>That page is here:</p>

<p><a href="http://www.nickhodges.com/LeanTed/bootstrap/about.html" rel="nofollow">http://www.nickhodges.com/LeanTed/bootstrap/about.html</a></p>

<p>The page uses bootstrap. I've looked and see no errors in the console when rendering the code.</p>

<p>As you can see, it is not doing what I want, which is using markdown.js to render the contents of a file into HTML.</p>

<p>Here's the weird part, and the root of my question:</p>

<p>If I open the page as a local file, Chrome does nothing.  IE9 will open and properly render the page, but only after I give permission to run the script.  </p>

<p>Both browsers fail to render the page correctly using the above link.  Firefox has the same result.  </p>

<p>I confess to being pretty much of a n00b on all this, but I'm at a loss to explain the inconsistent behavior.  I understand that the code is accessing a local file, but that shouldn't be a problem when accessed via the web server, right?</p>

<p>Anyway, and help will be appreciated.</p>

<p>UPDATE:
Here's the code for the page:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;LeanTed Markdown Editor&lt;/title&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    &lt;meta name="description" content=""&gt;
    &lt;meta name="author" content=""&gt;

    &lt;!-- Le styles --&gt;
    &lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;
    &lt;style&gt;
      body {
        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
      }
    &lt;/style&gt;
    &lt;link href="css/bootstrap-responsive.css" rel="stylesheet"&gt;

    &lt;!-- Le HTML5 shim, for IE6-8 support of HTML5 elements --&gt;
    &lt;!--[if lt IE 9]&gt;
      &lt;script src="http://html5shim.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
    &lt;![endif]--&gt;

    &lt;!-- Le fav and touch icons --&gt;
    &lt;link rel="shortcut icon" href="../assets/ico/favicon.ico"&gt;
    &lt;link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png"&gt;
    &lt;link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png"&gt;
    &lt;link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png"&gt;
    &lt;link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png"&gt;
  &lt;/head&gt;

  &lt;body&gt;

    &lt;div class="navbar navbar-inverse navbar-fixed-top"&gt;
      &lt;div class="navbar-inner"&gt;
        &lt;div class="container"&gt;
          &lt;a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;/a&gt;
          &lt;a class="brand" href="#"&gt;LeanTed Markdown Editor&lt;/a&gt;
          &lt;div class="nav-collapse collapse"&gt;
            &lt;ul class="nav"&gt;
              &lt;li&gt;&lt;a href="hero.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
              &lt;li class="active"&gt;&lt;a href="#"&gt;About&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="http://www.nickhodges.com/contact.aspx"&gt;Contact&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;&lt;!--/.nav-collapse --&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;

    &lt;div class="container"&gt;
      &lt;div id="mymarkdown"&gt;&lt;/div&gt;
    &lt;/div&gt; &lt;!-- /container --&gt;

    &lt;!-- Le javascript
    ================================================== --&gt;
    &lt;!-- Placed at the end of the document so the pages load faster --&gt;
    &lt;script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-transition.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-alert.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-modal.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-dropdown.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-scrollspy.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-tab.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-tooltip.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-popover.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-button.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-collapse.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-carousel.js"&gt;&lt;/script&gt;
    &lt;script src="../assets/js/bootstrap-typeahead.js"&gt;&lt;/script&gt;

    &lt;script src="markdown.js"&gt;&lt;/script&gt;


    &lt;script&gt;
     $("#mymarkdown").load("./LPInfo.md");
     var md = markdown.toHTML($("#mymarkdown").html());
     $("#mymarkdown").html(md);
    &lt;/script&gt;

  &lt;/body&gt;
&lt;/html&gt;
</code></pre>
