Is there any way to remove italic effect <i> tag using CSS?

Question

How do I remove italic effect of <i> tag so I can do this:

<span>     test<i>test</i> </span> 

I am filling some text in the <i> tag using jQuery innerHtml, so it comes in italic, but I don't want the italic effect.

Is there any way I can remove the italic effect using CSS?

I cant use a different tag. I can only use the <i> tag.

Answer 1

You just need to use this CSS code:

.no-italics {     font-style: normal;    } 

HTML code:

<span>    test    <i class='no-italics'>test</i> </span> 

Answer 2

Use font-style:

i {   font-style: normal; }