SyntaxHighlighter – Call SyntaxHighlighter.all() to highlight dynamically generated XML


I have javascript code that generates XML, and calls the SyntaxHighlighter.all() method to highlight the added XML. I do not receive errors in the console but neither does highlighting take place.


<script type="text/javascript" src="js/syntaxhighlighter_3.0.83/scripts/shCore.js"></script>
<script type="text/javascript" src="js/syntaxhighlighter_3.0.83/scripts/shBrushXml.js"></script>
<link type="text/css" rel="stylesheet" href="js/syntaxhighlighter_3.0.83/styles/shCoreDefault.css"

    function generateXML()
            var result="<test>WHATEVA</test>";


            var regex1 = new RegExp('<', 'g');
            var regex2 = new RegExp('>', 'g');

             result = "<pre class='brush: xml'>" + result.replace(regex1,'&lt;').replace(regex2,'&gt;')+"</pre>";

            document.getElementById("generatedXML").innerHTML = result;     


    <input id="addOUTPUTButton" type="button" value="Generate XML"  onclick="generateXML()"/>
    <input id="test" type="button" value="Test"  onclick="SyntaxHighlighter.all();"/>
<div id="generatedXML">


The solution is to use highlight() instead of all().

Here is a JSFiddle, note that external resources are used:

Answered By – Menelaos

Answer Checked By – Willingham (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.