Remove a specifc inline style with Javascript|jQuery
<p>I have the folowing code in my html:</p>

<pre><code>&lt;p id='foo' style='text-align:center; font-size:14pt; font-family:verdana; color:red'&gt;hello world&lt;/p&gt;
</code></pre>

<p>and that in my external css:</p>

<pre><code>#foo{ font-size:11pt; font-family:arial; color:#000; }
</code></pre>

<p>I want to remove all "font-size" and "font-family" in the "style" atribute, but not the "color" and others setted in external css.</p>

<p><strong>Result expected:</strong></p>

<pre><code>&lt;p id='foo' style='text-align:center; color:red'&gt;hello world&lt;/p&gt;
</code></pre>

<p><em><strong>Already tried:</em></strong></p>

<pre><code>$('#foo').removeAttr('style');   // That removes all inline
$('#foo').css('font-family',''); // That remove the css setted too
</code></pre>

<p>thanks</p>
