regex replace characters within tags

Question

I'm already using a html parser, but I need to create a regex that will select the < and > symbols within the first instance of <code> tags - in this case, the one with the class "html".

    <code class="html">
        <b>test</b><script>lol</script>
            <code>test</code> <b> test </b>
        <lol>
                        </lol>

            <test>
    </code>

So every < or > within the indented area starting from <b> to the start of the last </code> should be replaced, leaving the outer <code> tags alone.

I'm using javascript's .replace method and would like all < and > symbols within the code area to turn into ascii &#60; and &#62;.

I imagine its best to use a look forward/back regex using $1 etc. but can't figure out where to begin, so any help would be much appreciated.

Answer 1

How about something like this? In this example I'm creating a variable and populating the variable with html, just to get things started

var doc = document.createElement( 'div' );
doc.innerHTML =  ---your input html here

Here I'm pulling the code tag

var string = doc.getElementsByTagName( 'code' ).innerHTML; 

Once you have the string then simply replace the desired brackets with

var string = string .replace(/[<]/, "&#60;)
var string = string .replace(/[>]/, "&#62;)

then just reinsert the replaced value back into your source html

Answer 2

The easy way:

var elem = $('.html');
elem.text(elem.html());

This will not necessarily use literally < for escaping; if you're fine with a different escape, it's much simpler than anything else you can do, though.

If you have multiple elements like that, you might need to wrap the second line in an elem.each() ; otherwise the html() method will probably just concatenate the content from all elements or something similarly pointless.