DavidSzczesniak
10/29/2017 - 5:39 PM

Simple click event with jQuery

When the user clicks the button, the text of the element with the chosen class, is changed to say whatever we like. ("Here is the message" in this example)

click_event.html
content_copyfile_download
<script>
  $(document).ready(function() {
    // Click event handler
    $("#getMessage").on("click", function(){
      // Change the text of element with class .message on click
      $(".message").html("Here is the message");
    });
  });
</script>

<!-- Example markup -->
<div class="container-fluid">
  <div class = "row text-center">
    <h2>Cat Photo Finder</h2>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message">
      The message will go here
    </div>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12">
      <button id = "getMessage" class = "btn btn-primary">
        Get Message
      </button>
    </div>
  </div>
</div>