How can I remove all classes that are not named "message" from an element?
<p>I have the following:</p>

<pre><code>&lt;div id="abc"&gt;
&lt;/div&gt;
</code></pre>

<p>Inside that div there can be one only of the following:</p>

<pre><code>&lt;p class="message"&gt;
&lt;p class="message error"&gt;&lt;/p&gt;
&lt;p class="message warning"&gt;&lt;/p&gt;
&lt;p class="message success"&gt;&lt;/p&gt;
&lt;p class="message loading"&gt;&lt;/p&gt;
</code></pre>

<p>Is there a way that I can find and remove only the class from the <code>&lt;p&gt;</code> element that's NOT "message". I realize I could remove everything and then add what I need with .removeClass() but this won't work for me as after I previously added the message class I did some CSS changes and these will be lost if I remove all and then add again the message class.</p>
