Mootools 1.2 and Firefox $$ selecting too many elements

Question

Browser must be firefox

Mootools version must be 1.2.x

1. $$ selector returns too many elements only in firefox

http://jsfiddle.net/e77Xp/4/

HTML

<div class="only_trucks diagramz" id="diatruck">
    <div class="lf">lf</div>
    <div class="rf">rf</div>
    <div class="la">la</div>
    <div class="ra">ra</div>
    <div class="lrfo">lrfo</div>
    <div class="rrfo">rrfo</div>
    <div class="lrfi">lrfi</div>
    <div class="rrfi">rrfi</div>
    <div class="lrro">lrro</div>
    <div class="rrro">rrro</div>
    <div class="lrri">lrri</div>
    <div class="rrri">rrri</div>
</div>

JS

selected = $$('.rf');
alert(selected.length);
console.log(selected);

This should only return 1 result but returns multiple results. It seems to be matching other classes that have "rf" in them.

Besides updating to the latest version of mootools or changing class names, does anyone have a good fix for this?

Answer 1

Its a bug but it can be fixed (thanks to this answer). Add this code to your JavaScript.

String.prototype.contains = function(string, separator){
    return (separator) ? (separator + this + separator).indexOf(separator + string + separator) > -1 : String(this).indexOf(string) > -1;
};

Here is a fixed demo