multiple condition in ternary operator in jsx : <pre><code>&lt;div style={{'backgroundColor': status === 'approved' ? 'blue' : 'black'}}&gt;
&lt;/div&gt;
</code></pre>

<p>black is the default color but what if I want to add the 3rd condition? </p>

<p>status can be 'approved', 'rejected', 'pending' or more.</p>
