JSON API AJAX Change Text with click Events

JavaScript
1

Hello Everybody!
The code actually performs on the right preview pane exactly as it is requested to do.
Anyway the test doesn’t pass.
I’ve either tried to change the class name of the <p> from “message box” to “message” in order to match the exercise request — but it still doesn’t work. The test result is still:

// running tests
Your code should use the document.getElementsByClassName method to select the element with class message and set its textContent to the given string.
// tests completed

So my code so far…

  document.addEventListener('DOMContentLoaded',function(){
    document.getElementById('getMessage').onclick=function(){
      // Add your code below this line
      document.getElementsByClassName('message')
      [0].textContent="Here is the message";
      
      // Add your code above this line
    }
  });
</script>
<style>
  body {
    text-align: center;
    font-family: "Helvetica", sans-serif;
  }
  h1 {
    font-size: 2em;
    font-weight: bold;
  }
  .box {
    border-radius: 5px;
    background-color: #eee;
    padding: 20px 5px;
  }
  button {
    color: white;
    background-color: #4791d0;
    border-radius: 5px;
    border: 1px solid #4791d0;
    padding: 5px 10px 8px 10px;
  }
  button:hover {
    background-color: #0F5897;
    border: 1px solid #0F5897;
  }
</style>
<h1>Cat Photo Finder</h1> 
<p class="message">
  The message will go here
</p>
<p>
  <button id="getMessage">
    Get Message
  </button>
</p>

Google Chrome Version 71.0.3578.98 (Offizieller Build) (64-Bit)

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Link to the challenge:learn.freecodecamp.org/data-visualization/json-apis-and-ajax/change-text-with-click-events

Thanks for helping!!!

2

I solved it by myself — just reset the code and typed again:

document.getElementsByClassName('message')
      [0].textContent="Here is the message";

without entering any newline between selector and index in square brackets.
But formally should have been validated anyway, or not?

Anyway - - - solved!

1 Like