toggle css ability nested elements

without controlling javascript, there proceed css ability toggle off by nested elements.

the problem i'm perplexing solve i have array tags classes calm italic (<em>, <blockquote>, <cite>, <q>, <dfn>, classes), inside another these, italicisation needs toggle.

<blockquote>
    male said, <q>that's <cite>catcher rye</cite>, dear
    fellow!</q>, trust that?!
</blockquote>

should news as:

and male said, "that's catcher rye, dear fellow!", trust that?!

the css i've got removing bit messy:

q, em, dfn, cite, blockquote {
    font-style: italic;
}
q q, q em, q dfn, q cite,
em q, em em, em dfn, em cite,
dfn q, dfn em, dfn dfn, dfn cite,
cite q, move em, move dfn, move cite,
blockquote q, blockquote em, blockquote dfn, blockquote move {
    font-style: normal;
}

...and i'm graceful certain won't even work past turn nesting (as example).

is there proceed i but have list each unfamiliarity tags?