# JSON APIs and Ajax: Handle Click Events with JavaScript using the onclick property

**URL:** <https://forum.freecodecamp.org/t/json-apis-and-ajax-handle-click-events-with-javascript-using-the-onclick-property/425571>\
**Category:** freeCodeCamp Contributors\
**Tags:** contributing\
**Created:** [October 14, 2020, 3:37pm UTC](https://forum.freecodecamp.org/t/json-apis-and-ajax-handle-click-events-with-javascript-using-the-onclick-property/425571 "2020-10-14T15:37:54Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![gillmansher](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/gillmansher/32/134249_2.png) [@gillmansher](https://forum.freecodecamp.org/u/gillmansher)\
**Post date:** [October 14, 2020, 3:37pm UTC](https://forum.freecodecamp.org/t/json-apis-and-ajax-handle-click-events-with-javascript-using-the-onclick-property/425571/1 "2020-10-14T15:37:54Z")

</div>

**What is your hint or solution suggestion?**

> **Solution**
>
> ```auto
> <script>
> document.addEventListener('DOMContentLoaded', function(){
> // Add your code below this line
> 
> document.getElementById('getMessage').onclick = function(){};
> // 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 box">
> The message will go here
> </p>
> <p>
> <button id="getMessage">
> Get Message
> </button>
> </p>
> 
> ```

**Challenge:** Handle Click Events with JavaScript using the onclick property

**Link to the challenge:**

> **[freeCodeCamp.org](https://www.freecodecamp.org/learn/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property)**
>
> Learn to Code — For Free

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 6:32pm UTC](https://forum.freecodecamp.org/t/json-apis-and-ajax-handle-click-events-with-javascript-using-the-onclick-property/425571/2 "2021-06-01T18:32:16Z")

</div>


