title: Prism.js Disturbs Ajax?
body: <p>I have two simple Python code files <code>hello.py</code> and <code>world.py</code>.</p>
  <pre><code>print(&quot;hello&quot;)
  </code></pre>
  <pre><code>print(&quot;world&quot;)
  </code></pre>
  <p>Based on <a href="https://stackoverflow.com/questions/39913138">this way</a>, I wrote, using both Prism.js and Ajax, an HTML file <code>helloworld.htm</code> that formats and presents either <code>hello.py</code> or <code>world.py</code> at a time as follows.</p>
  <pre><code>&lt;!doctype html&gt;
  &lt;script src=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/prism.min.js&gt;&lt;/script&gt;
  &lt;script src=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/plugins/line-numbers/prism-line-numbers.min.js&gt;&lt;/script&gt;
  &lt;script src=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/components/prism-python.min.js&gt;&lt;/script&gt;
  &lt;link rel=stylesheet href=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/themes/prism.min.css&gt;
  &lt;link rel=stylesheet href=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/plugins/line-numbers/prism-line-numbers.min.css&gt;
  &lt;link rel=stylesheet href=https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/themes/prism-coy.min.css&gt;
  &lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js&quot;&gt;&lt;/script&gt;
  &lt;script type=&quot;text/javascript&quot;&gt;
      function btnclick(_url){
          $.ajax({
              url : _url,
              type : 'post',
              success: function(data) {
               $('#DIVID').html(data);
              },
              error: function() {
               $('#DIVID').text('An error occurred');
              }
          });
      }
  &lt;/script&gt;
  &lt;div style=&quot;width:50%;height:100%;position:fixed;top:0;left:0&quot;&gt;
  &lt;a href=&quot;cursor:pointer&quot; onclick=&quot;btnclick('hello.py')&quot;&gt;hello.py&lt;/a&gt;&lt;br&gt;
  &lt;a href=&quot;cursor:pointer&quot; onclick=&quot;btnclick('world.py')&quot;&gt;world.py&lt;/a&gt;
  &lt;div style=&quot;width:50%;height:100%;position:fixed;top:0;left:50%&quot;&gt;
  &lt;pre class=line-numbers&gt;&lt;code class=lang-py&gt;&lt;div id=&quot;DIVID&quot;&gt;&lt;?php include('hello.py');?&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;
  </code></pre>
  <p>Unfortunately, this HTML file does not work correctly with <code>&lt;code class=lang-py&gt;</code> in the last line. Though <code>&lt;code&gt;</code> instead of <code>&lt;code class=lang-py&gt;</code> solves this problem, I still want to use Prism.js to format the code files. How can I address this issue?</p>
  <p>P.S. It seems that this problem is related to <a href="https://schier.co/blog/how-to-re-run-prismjs-on-ajax-content" rel="nofollow noreferrer">How to Re-Run Prism.js on AJAX Content</a> and that <code>Prism.highlightAll();</code> needs to be run together with Ajax, though I could not find the correct location of <code>Prism.highlightAll();</code> yet.</p>