title: w3school include HTML, javascript not working
body: <p>So, I recently used w3school include html, so that i dont have to copy-paste same div to all my pages. </p>
  
  <p>First, i used it for header and footer, which uses some CSS styling, and it has no problem, works perfectly.</p>
  
  <p>But then, i tried to use it again for my dropdown Navbar, which include some javascript, the HTML got included fine, but the javascript that i put doesnt work ! Nothing is wrong with the javascript, it works fine when I didn't use the include HTML. Here's the code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('#leftDrop1').on('click', function() {
    if ($('#sub1').css('display') == 'block') {
  
      $('#sub1').hide()
  
    } else {
      $("#sub1").show()
    }
  })
  
  $('#leftDrop2').on('click', function() {
    if ($('#sub2').css('display') == 'block') {
  
      $('#sub2').hide()
  
    } else {
      $("#sub2").show()
    }
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  
  
  &lt;script src="http://www.w3schools.com/lib/w3data.js"&gt;&lt;/script&gt; 
  
  &lt;div w3-include-html="dropdown.html"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>and here's what inside the dropdown.html</p>
  
  <pre><code>&lt;div class="col-lg-3"&gt;
              &lt;ul id="dropKiri"&gt;
                  &lt;li id="leftDrop1"&gt;&lt;a class="dropIcon"&gt;&lt;i class="fa fa-caret-right" aria-hidden="true"&gt;&lt;/i&gt;&lt;/a&gt;Category 1&lt;/li&gt;
                      &lt;div id="sub1"&gt;&lt;ul&gt;
                          &lt;li&gt;Sub 1&lt;/li&gt;
                          &lt;li&gt;Sub 2&lt;/li&gt;
                          &lt;li&gt;Sub 3&lt;/li&gt;
                      &lt;/ul&gt;&lt;/div&gt;
  
                  &lt;li id="leftDrop2"&gt;&lt;a class="dropIcon"&gt;&lt;/a&gt;&lt;i class="fa fa-caret-right" aria-hidden="true"&gt;&lt;/i&gt;&lt;/a&gt;Category 2&lt;/li&gt;
                      &lt;div id="sub2"&gt;&lt;ul&gt;
                          &lt;li&gt;Sub 1&lt;/li&gt;
                          &lt;li&gt;Sub 2&lt;/li&gt;
                          &lt;li&gt;Sub 3&lt;/li&gt;
                      &lt;/ul&gt;&lt;/div&gt;
  
                  &lt;li style="list-style-type: none;"&gt;Category 3&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>I dont know how to put 2 html pages on snippet, i'm sorry if this is a bit confusing</p>