How can I change the CSS of a specific word?
<p>I've been searching for this answer for a while but could not find any specific information on this.</p>

<p>To put it down in words:
I want to change the color of a specific words in a class.</p>

<p>Example:
if the class contains the word Online it would make it a green color.
if the class contains the word Offline it would make it red.</p>

<p>now for the code:</p>

<pre><code>&lt;section class="even"&gt;
                &lt;h5&gt;Voltz 2.0.4&lt;/h5&gt;
                &lt;span class="tag version"&gt;&lt;span&gt;1.5.2&lt;/span&gt;&lt;/span&gt;
                &lt;div class="serverinfo"&gt;
                    &lt;p&gt;Status: &lt;span class="status"&gt;&lt;/span&gt;&lt;/p&gt;
                    &lt;p&gt;Players: &lt;span class="voltz-onlineplayers"&gt;&lt;/span&gt;/&lt;span class="voltz-maxonlineplayers"&gt;&lt;/span&gt;&lt;/p&gt;
                    &lt;p&gt;IP: voltz.arcadia.eu&lt;/p&gt;
                &lt;/div&gt;
                &lt;a class="button" href="vote.html#voltz"&gt;Vote&lt;/a&gt;
                &lt;a class="button" href="modpacks.html#voltz"&gt;Modpack Info&lt;/a&gt;
            &lt;/section&gt;
</code></pre>

<p>the class voltz-online will either fill in the word online or offline regarding on the response of the server (already been done).</p>

<p>but i want to check if the class status contains the word online or offline.
I'm not entirely sure what I should use to get that effect.</p>

<p>I'm pretty sure I have to use this function but that's as far as I got.</p>

<pre><code>$( document ).ready(function() {
        //code to change color here.
    });
</code></pre>

<p>I'd be great if anyone could explain this with an example code.
And feel free to ask questions if you're missing information</p>

<p><strong>Edit:</strong>
to give a visual example of what I mean to make things a bit more simple.
<a href="https://i.stack.imgur.com/yHG0K.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/yHG0K.png" alt="http://prntscr.com/apgb5p"></a></p>

<p>where i want the highlighted text to become green when it says Online and red when it says Offline.</p>