How to display code inside a block

how can i display code inside blocks like stackoverflow does this:

<p> <strong> strong text 开发者_如何学JAVA<em> strong and emphasised text </em> </strong> <em> just emphasised text </em> </p>

note: i have all the text wrapped around a div and retrieved from a database

thanks

The characters making up the HTML code are converted into their corresponding HTML entities...

<pre>
  <code>
    &lt;p&gt; &lt;strong&gt; strong text &lt;em&gt; strong and emphasised text &lt;/em&gt; &lt;/strong&gt; &lt;em&gt; just emphasised text &lt;/em&gt; &lt;/p&gt;
  </code>
</pre>

If you want to grab code, then convert it for viewing, just replace the < with < and > with >. Here is a simple demo doing just that.

var html = $('#html').html(),
    code = $.trim(html); // remove leading & trailing carriage returns

// replace angled brackets
code = code.replace(/[<>]/g, function(m){
        return {
            '<' : '&lt;',
            '>' : '&gt;'
        }[m];
    });

$('pre').html(code);