title: jquery selector problem with script tags
body: <p>I'm attempting to select all <code>&lt;script type="text/html"&gt;</code> tags in a page. I use <code>&lt;script&gt;</code> tags to store HTML templates, similar to <a href="http://ejohn.org/blog/javascript-micro-templating/" rel="noreferrer">how John Resig does it</a>.  For some reason, the following jquery selector doesn't seem to be selecting anything:</p>
  
  <pre><code>$("script[type*=html]").each(function() {
      alert("Found script "+this.id);
  });
  </code></pre>
  
  <p>This markup is in the BODY of the HTML document:</p>
  
  <pre><code>&lt;body&gt;
      &lt;script id="filter-search" type="text/html"&gt;
          &lt;dt&gt;Search&lt;/dt&gt;
          &lt;dd&gt;&lt;input type="text"/&gt;&lt;/dd&gt;
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I've also tried putting it into the HEAD of the HTML document, and it is still not found. No alert is ever shown.</p>
  
  <p>If I instead change my code to this:</p>
  
  <pre><code>$("script[type*=javascript]").each(function() {
      alert("Found script "+this.id);
  });
  </code></pre>
  
  <p>Then it finds only the scripts in the HEAD that have a <code>src</code> to an external file. Scripts in the actual page are not found.  For instance, with the following in HEAD:</p>
  
  <pre><code>&lt;head&gt;
      &lt;script type="text/javascript" src="jquery.js" id="jquery"&gt;&lt;/script&gt; 
      &lt;script type="text/javascript" src="jquery-ui.js" id="ui"&gt;&lt;/script&gt; 
      &lt;script type="text/javascript" id="custom"&gt;
          $(document).ready( function() {
              $("script[type*=javascript]").each(function() {
                  alert("Found script "+this.id);
              });         
              $("script[type*=html]").each(function() {
                  alert("Found TEMPLATE script "+this.id);
              });         
          });
      &lt;/script&gt; 
      &lt;script id="filter-test" type="text/html"&gt;
          &lt;dt&gt;Test&lt;/dt&gt;
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;script id="filter-search" type="text/html"&gt;
          &lt;dt&gt;Search&lt;/dt&gt;
          &lt;dd&gt;&lt;input type="text"/&gt;&lt;/dd&gt;
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I get the following alerts:</p>
  
  <ul>
  <li>Found script jquery</li>
  <li>Found script ui</li>
  </ul>
  
  <p>The <code>custom</code> and <code>filter-test</code> scripts in the HEAD are not selected, nor is the <code>filter-search</code> script in the <code>body</code> tag.</p>
  
  <p>Is this the expected behavior? Why does this not work? I can work around it, but it is annoying that it doesn't work.</p>
  
  <p><strong>EDIT:</strong> It turns out this actually does work fine using the example above. In my situation, the jquery code was in an external Javascript module, and it was definitely not working. When I moved the code into a script tag on the page itself it worked. I still haven't figured out why it wouldn't work in the external file, but will report back here if I get around to solving it at some point.</p>