Italics in JavaScript without making variables with variableName.italics()?

Question

everyone!

I'm writing a trivia game for a website with JavaScript that stores all question texts, answers, and level of difficulty in a single, multi-dimensional array and sometimes I need to put book titles in italics. However, I'm having trouble with the italics.

I'd love to just use HTML tags to do this but they just print on the screen like this:

The title of the books is <i>I Wish I were in Italics!</i>

I also tried making each title into a string variable and using the String italics() method like this:

var italicsTest = "I Wish I were in Italics!";    
Question = ["1", "2", "1824", "The title is" + italicsTest.italics()];

That produces the same result as above. The HTML tags show up as text on the page.

Does anyone know how I can fix this? Thanks!

-ThatsIsJustCrazy

** EDIT: I was inserting the text into my HTML file with JQuery like this:

$(".questionText").text(Question[randomNum1][randomNum2]);

but I should have been using "html" not "text." It needed to be this:

$(".questionText").html(Question[randomNum1][randomNum2]);

Thanks, everyone!

Answer 1

Try this:

var italicsTest = "I Wish I were in Italics!"; 
var Question = ["1", "2", "1824", "The title is " + italicsTest.italics()];

$(document).ready(function() {
  $.each(Question, function(index){  
   $("<p>"+Question[index]+"</p>").appendTo($('#content'));
 });
});

on jsfiddle

or with html() on jsfidlle