Плагин jQuery.niceCode

Демонстрация работы

<section role="main">
<div class="descr">
<h2>Демонстрация работы</h2>
<pre class="cn-pre" data-text="pre">&lt;div> Исходный код pre &lt;/div></pre>
<pre class="cn-pre" data-text="pre>code"><code>&lt;div> Исходный код pre>code &lt;/div></code></pre>
<pre class="cn-pre">Исходный код без указания атрибута data-text</pre>
<pre class="cn-pre wrapped" data-text="pre-2">Это исходный код с классом wrapped - он не будет превращаться в кнопку.</pre>				
<div id="newpre"></div>
</div>
<button class="addPre btn">Добавить ещё один pre</button>
</section>

<div> Исходный код pre>code </div>jQuery(document).ready(function($) {

	// Динамическое добавление нового кода	
	$('.addPre').click(function() {
		f = Math.round(Math.random()*10);

		$('#newpre').append('<pre class="cn-pre" data-text="pre-'+f+'">Ещё немного кода ('+f+')</pre> ');
		// Переинициализация
		$('.cn-pre').niceCode();
	});
});

Исходный код без указания атрибута data-text

Это исходный код с классом wrapped - он не будет превращаться в кнопку.