Not escaping dom elements in <pre><code>.

[FiV0]

Hey,

thanks for the awesome highlighter. I was wondering if it's somehow possible to not escape html tags. The two use cases I am thinking of are

<pre><code class="lisp">(<a class="code-link" href="http://www.lispworks.com/reference/HyperSpec/Body/m_defun.htm">defun</a> test-syntax-highlighter ()
  "Docstring explaining what this function does."
  (let ((hash (make-hash-table :test #'equal)))
    ...))</pre></code>

with the css code-link being something like

.code-link {
  color:inherit;
  text-decoration:inherit;
}

so I could for example link to the Hyperspec or somewhere else. Secondly some highlighting feature for searching

<pre><code class="lisp">(defun <mark>id</mark> (x) x)</code></pre>

I don't know if it's a big change or only a minor tweak.

[ashok-khanna]

I am doing something similar, but for me what worked was to programmatically insert the HTML elements after running High�light Lisp. For example the below will run highlight js and then add a copy to clipboard button to it (also removes starting and trailing whitespace):

  const codes = document.getElementsByTagName("code");

  for (code of codes){
    code.textContent = code.textContent.trim();
  }

  HighlightLisp.highlight_auto();
  HighlightLisp.paren_match();

  $('code').prepend('<button class="copy-btn">Copy to Clipboard</button>');

  $('code button.copy-btn').click(function(e) {
    var text = $(this).parent().text().substring(17); //.text();
    var newText = text.trim();
    var copyHex = document.createElement('textarea');
    // copyHex.style.whiteSpace = "pre";
    copyHex.value = newText;
    document.body.appendChild(copyHex);
    copyHex.select();
    document.execCommand('copy');
    console.log(copyHex.value)
    document.body.removeChild(copyHex);
  });
})