Dustin Moore Dustin Moore - 21 days ago 5x
Javascript Question

Trouble concatenating strings

I'm having an issue concatenating strings. Where I initially declare the 'output' variable in my last function, I'm able to get the number of questions correct printed to my modal window.

However, my concatenation of strings 2 lines down from that won't work and I've tried so many things. I'm sure it's something simple but any help would be appreciated!

I'm not sure how much code is relevant to the solution so I apologize for the wall of code.

I'm new to JS and my first post on Stackoverflow so any tips or advice is appreciated. Thanks in advance!

var randomNum1 = 0;
var randomNum2 = 0;
var correctAnswer = 0;
var questionNumber = 0;
var question = "<h2>Question #: " + questionNumber + "</h2>";
var answersRight = 0;
//jQuery command to make enter key submit answer
$(document).keypress(function(e) {
if (e.which == 13) {
//questions object
var questionsAsked = [

document.getElementById('finished').style.display = 'none';
//check answer, push question info to array
function check() {
var userAnswer = parseInt(document.getElementById("userAnswer").value);
document.getElementById('userAnswer').value = "";
if (userAnswer === correctAnswer) {
} else {
answersRight += 0;
if (questionNumber < 3) {
} else {
document.getElementById('sub').style.display = 'none';
document.getElementById('submitForm').style.display = 'none';
document.getElementById('finished').style.display = 'block';

function random() {
return Math.floor(Math.random() * 50) + 1;
//generate random numbers

function generateRandom() {
randomNum1 = random();
randomNum2 = random();
document.getElementById("randomNum1").innerHTML = randomNum1;
document.getElementById("randomNum2").innerHTML = randomNum2;
correctAnswer = randomNum1 + randomNum2;
questionNumber += 1;
question = "<h2>Question #: " + questionNumber + "</h2>";
questionsAsked.push([questionNumber, randomNum1, randomNum2, correctAnswer]);
//next button

function next() {

function finish() {
var output = document.getElementById("quizResults").innerHTML = 'You got ' + answersRight + ' out of ' + questionNumber + ' answers correct!';
var percent = Math.round((answersRight / questionNumber) * 100);
output += ' You got ' + percent + '% on this quiz! Outstanding!';

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container">
<h1 class="text-center">Welcome to Math World!</h1>
<div id="question">
<div id="questionArea">
<h3>Add the following numbers</h3>
<h3 id="randomNum1"></h3>
<h3 id="randomNum2"></h3>
<p id="message"></p>
<div id="submitForm">
<div class="form-inline">
<div class="form-group">
<label for="answer">Enter Answer:</label>
<input type="text" class="form-control" id="userAnswer" placeholder="Type answer here">
<button id="sub" type="submit" class="btn btn-primary" onclick="check()">Submit Answer</button>
<button id="finished" type="submit" class="btn btn-success" data-toggle="modal" data-target="#myModal">Finish Quiz</button>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Quiz Results</h4>
<div id="quizResults" class="modal-body">

<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>



(Disclaimer: This answer might not actually solve your problem, as noted in the comments. I can't delete it, though, because it was accepted.) (Please see the other answer)

The line

var output = document.getElementById("quizResults").innerHTML = 'You got '+answersRight+ ' out of ' +questionNumber+ ' answers correct!';

does not have the effect you think it does, because javascript does not interpret a statement like var a = b = c the way you think it does. Instead, it is better to use var a = c; var b = c;, like so:

var output = 'You got '+answersRight+ ' out of ' +questionNumber+ ' answers correct!';
document.getElementById("quizResults").innerHTML = output;

For more information on how javascript interprets var a = b = c;, please see this question: Javascript a=b=c statements