Button onclick ajax call

Question

I am trying to put together a webpage that has multiply pages in 1 file which checks the session that i've created to show a page according to the session value.
However, i want to create a button that does a ajax call on the background and returns the results thought JSON, BUT i don't know if i'm doing it the right way.
I have this js:

$(document).ready(function() {
var alert = $('.Cmessage'); // DIV TO PUSH RESULTS TO

$("#terug").on('click', function(){

$.ajax({
  url: 'http://www.XXX.nl/shop/offerte/back.php', // form action url
  type: 'get', // form submit method get/post
  dataType: 'json', // request type html/json/xml 
  beforeSend: function() {
    alert.fadeOut();
  },
success: function(result) {
    if(result.error){
        alert.html(result.html).fadeIn();
        console.log(e)
    }else{
        alert.html(result.html).fadeIn();
        }
    }
});
});
});

This js needs to check whenever i click on:

<button type="button" class="terug">Open/Laden</button>

But somehow i fail to get it attached to the class "terug" and do something with it.

Does anybody has any suggestions/idea's on how i can do this better and get it working ? :P

Greetings.

Answer 1

You made a typo.

#terug is an id selector

<button type="button" class="terug"> doesn't have an id attribute

Either use a class selector ( . ) or use an id attribute.

Answer 2

You are selecting your button with the wrong jQuery selector.

$("#terug").click..

Try to use $('.terug') instead.

'#' selecting by id
'.' selecting by class

Answer 3

Looks like your selecting an id # when you should be using a class selector.

$(".terug").on('click', function()

Answer 4

I would say you are doing it right. Now use jQuery append to add content to some html element (div usually) instead of alerting it.

http://api.jquery.com/append/

Answer 5

You are using class. But I used # to call the class. You should use .(dot) instead of #.