highlighting html with prism.js

javascript, prism.js

Solution

You need to escape the beginning of the tags with `&lt;`. The easiest way is to paste your html code into the pre tag, then perform a find and replace for all `<` characters.

This should work:

&lt;table class="data-table">
    &lt;tr>
        &lt;td>Title&lt;/td>
        &lt;td>Amount&lt;/td>
    &lt;/tr>
    &lt;tr>
        &lt;td>Shorts&lt;/td>
        &lt;td>£1.00&lt;/td>
    &lt;/tr>   
    &lt;tr>
        &lt;td>Shorts&lt;/td>
        &lt;td>£1.00&lt;/td>
    &lt;/tr>           
&lt;/table>

Problem

I cant seem to highlight html with prism.js because it removes the markup just printing the text. the following code inside the "pre" tag shows as just the text. I have the class for the "code" tag set to "language-markup". ``` <table class="data-table"> <tr> <td>Title</td> <td>Amount</td> </tr> <tr> <td>Shorts</td> <td>£1.00</td> </tr> <tr> <td>Shorts</td> <td>£1.00</td> </tr> </table> ``` shows as ``` Title Amount Shorts £1.00 Shorts £1.00 ```

Original source

Related problems