Print Javascript Array Value Properly

Question

So I have a javascript array and in the array I have this:

var quiz = [{
    "question": "What is the greatest common factor of 105 and 126?",
    "image": "",
    "choices": ["3", "7",
        "9", "21", "35"
    ],
    "correct": "21",
    "conceptlink": "https://www.khanacademy.org/math/in-sixth-grade-math/playing-numbers/highest-common-factor/v/greatest-common-divisor",
    "explanation": "In order to solve this question, you must factor each number into prime factors<h1>Height</h1>",
}];

Focus on the explanation subset of the array. I have an H1 element that I want to print but, instead, it is printed as part of a text instead of code. In other words, the text would read:

Instead of:

Here's the code that prints the explanation

 $('#explanation').html('<strong>Incorrect.</strong> ' + htmlEncode(quiz[currentquestion]['explanation']));

Any help from the js experts would be gladly appreciated!!

`htmlEncode()` seems to work correctly :) – Andreas Aug 18 '16 at 17:45 — Andreas, Aug 18 '16 at 17:45
Unfortunately. I tested it multiple times. :( – Abdul Diaz Aug 18 '16 at 17:52 — Abdul Diaz, Aug 18 '16 at 17:52

score 0 · Accepted Answer · edited May 23 '17 at 11:44

0

You almost have it. I'm not sure what your function htmlEncode() does, but if you don't use it, it should give you what you want. Here's a jsbin demonstrating it: http://jsbin.com/yeyuqoqabe/edit?html,output

If you want to know how to make the string HTML safe, here's a question that can help: How to encode a string in JavaScript for displaying in HTML?

edited May 23 '17 at 11:44

Community

1
1

answered Aug 18 '16 at 18:03

MauroPerez

364
3
10

Thanks. I thought htmlEncode was native to Jquery. I found the source code and edited the function! – Abdul Diaz Aug 18 '16 at 18:30

score 0 · Answer 2 · answered Aug 18 '16 at 18:33

0

You can use jQuery to escape yout text.

var escaped = $("<div>").text(quiz[0]['explanation']).html();

https://jsfiddle.net/ouu6x2ge/

answered Aug 18 '16 at 18:33

Ansemo Abadía

479
3
10

score 0 · Answer 3 · answered Aug 18 '16 at 20:56

0

I don't think you need htmlEncode for that. I would suggest you try:

$('#explanation').html('<strong>Incorrect.</strong><span>').find('span').text(quiz[currentquestion]['explanation']))

answered Aug 18 '16 at 20:56

JJ122

46
3

Print Javascript Array Value Properly

3 Answers3