Q:

What is wrong with my second conditional?

I am fairly new to javascript and I ran into a logical error in my code.
var btn = document.querySelector("button");
var para = document.querySelector(".paragraph");
var prevVal = document.querySelector(".prevVal");

var randomArray = [" Hello", " Hi", " How are you?", " How was your day?", " Tell me a joke.", " I am having a good day."];
var previousValueArray = [];

btn.addEventListener("click", function(){
  var randomValue = randomArray[Math.floor(Math.random() * randomArray.length)];

  //pushing value in previousValueArray
  previousValueArray.push(randomValue);
  if (previousValueArray.length === 6){
     previousValueArray.shift();
  }
  if (previousValueArray[previousValueArray.length - 1] === randomValue){
     para.textContent = "Sorry, but this was the previous value. Click again please.";
  }

  para.textContent = randomValue;
  prevVal.textContent = previousValueArray;
});

I am trying to get my second if conditional to change the textConent of para . I am testing to see if the last value in previousValueArray and randomValue are equal. To make this a little more clear, I am trying to create a test project that if the user clicks a button, it outputs a random value from randomArray - I got this working. Next, I wanted to go to the next level and make sure my program didn't execute the same value twice in a row. I can't get this to work. Any help?
Here is the HTML:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <button type="button">Random Value</button>
  <p class="paragraph"></p>
  <p class="prevVal"></p>
  <script src="main.js"></script>
</body>
</html>

A:

Your condition is always true, since you push the new value to the Array (= last element) and then compare it with itself. Then, para gets overwritten with randomValue anyway. This works (except quick fix with -2:
var btn = document.querySelector("button");
var para = document.querySelector(".paragraph");
var prevVal = document.querySelector(".prevVal");

var randomArray = [" Hello", " Hi", " How are you?", " How was your day?", " Tell me a joke.", " I am having a good day."];
var previousValueArray = [];

btn.addEventListener("click", function(){
  var randomValue = randomArray[Math.floor(Math.random() * randomArray.length)];

  //pushing value in previousValueArray
  previousValueArray.push(randomValue);
  if (previousValueArray.length === 6){
     previousValueArray.shift();
  }

  // randomValue just pushed to the array -> last element.
  // comparison with itself is always true, so use the element before that:
  // (may fail at beginning with empty Array)
  if (previousValueArray[previousValueArray.length - 2] === randomValue){
     para.textContent = "Sorry, but this was the previous value. Click again please.";
  }
  else{
    // don't overwrite
    para.textContent = randomValue;
  }

prevVal.textContent = previousValueArray;

});

