Question

This is a jQuery variant of a script (it doesn’t work):

<script language="javascript">
$("div.post-content").each(function(){
    if($(this).innerHTML.indexOf("[/float]") != -1) {
        pattern= /\[float=(.*?)\]([^\[]*)\[\/float\]/gi
        $(this).html($(this).innerHTML.replace(pattern, "<span style='float: $1;'>$2</span>"))
    }
})
</script>

This is the pure Javascript variant (it works perfectly):

<script language="javascript">
posts=document.getElementsByTagName("div")
for(x in posts) if(posts[x].className=="post-content") {
    post = posts[x].innerHTML;
    if(post.indexOf("[/float]") != -1) {
        pattern = /\[float=(.*?)\]([^\[]*)\[\/float\]/gi
        posts[x].innerHTML = posts[x].innerHTML.replace(pattern, "<span style='float: $1;'>$2</span>")
    }
}
</script>

What this script does:

1. It seeks out all divs with class post-content.
2. It checks whether there’s a closing tag for bbcode.
3. By using regular expression, it seeks out patterns of given bbcode tags.
4. It replaces bbcode tags with html element.

I don’t know what I did wrong here…

Answer 1

Don’t use innerHTML when using jQuery. It’s wrong when assigning a value (memory leaks), and a bad practice when reading a value. Use

$(this).html()

or, if you really want to,

$(this)[0].innerHTML

The jQuery object returns an array, that doesn’t have a innerHTML property. But then again, use .html() for a code more of the style of jQuery.