hide option select value based on option value selected on first options
<p>I have two select option field.</p>

<pre><code>&lt;div style="float:left; width:7%"&gt;
&lt;label&gt;Type&lt;/label&gt;             
&lt;select name="ostatus" id="ostatus" class="input-small"&gt;
&lt;option value="Actual"&gt;Actual&lt;/option&gt;
&lt;option value="Ghost"&gt;Ghost&lt;/option&gt;
&lt;/select&gt;


&lt;div style="float:left; width:7%"&gt;
&lt;label&gt;Upgrade&lt;/label&gt;              
&lt;select name="oupg" id="oupg" class="input-small"&gt;
&lt;option value="Exp" &gt;Exp&lt;/option&gt;
&lt;option value="Post" &gt;Post&lt;/option&gt;
&lt;option value="Upgrade" &gt;Upg&lt;/option&gt;
&lt;option value="Retail" &gt;Retail&lt;/option&gt;
&lt;option value="Prepaid" &gt;Prepaid&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>If on the Type select, Ghost is selected, I would like to hide option Retail and Prepaid under the upgrade options. How do I go about this? I am able to hide the whole div container for upgrade but I only want to hide those last two options. Please some assistance would be appreciated.</p>
