Untitled

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <style>
            .nom {
                color:blue;
            }
        </style>
    </head>
    <body>
        <p id="testHighlight">@ericafustero Why thank you. Your work looks awesome by the way! @treemelody</p>

        <script>
            $(function() {
                jQuery.fn.highlight = function (str, className) {
                    var regex = new RegExp(str, "gi");
                    return this.each(function () {
                        $(this).contents().filter(function() {
                            return this.nodeType == 3 && regex.test(this.nodeValue);
                        }).replaceWith(function() {
                            return (this.nodeValue || "").replace(regex, function(match) {
                                return "<span class=\"" + className + "\">" + match + "</span>";
                            });
                        });
                    });
                };

                //Ici on a
                // #testHighlight : le <p></p> concerné par la fonction
                // "nom" : la classe appliquée aux mots commençant par @
                // (@[a-zA-Z0-9]{1,}) : expression régulière permettant de reconnaître les mots commençant par @
                $("#testHighlight").highlight("(@[a-zA-Z0-9]{1,})", "nom");
            });

        </script>
    </body>
</html>