How to load new data without refreshing page?

$("#get-tweets").on("click", function(){
    getRequest =
        $.ajax({
            url: "/tweets?offset=10",
            type: "GET"
        });
        getRequest.done =
            function(response){
                console.log("Success!");
                console.log(response);
            };
});

getRequest =
    $.ajax({
        url: "/does_not_exist"
        type: "GET"
    });
getRequest.fail =
    function(response){
        console.log("Failure :(")
    };

getRequest.done =
    function(response){
        console.log("response text: " +
            response.responseText);
        console.log("response http status: " +
            response.status);
    };

Sending data

$(".tweet-button").on("click", function(){
    $.ajax({
        url: "/tweets",
        type: "POST"
    });
});

You can't post an empty tweet!

$(".tweet-button").on("click", function(){
    $.ajax({
        url: "/tweets",
        type: "POST",
        data: 
        {
            content: 'my first tweet! #twitter'
        }
    });
});

Use the DOM to your advantage

<form>
    <input type="text" name="username">
    <input type="text" name="email">
    <input type="password" name="password">
</form>

$("form").serialize();
"username=ismcodes&email=isaac@isaac.com&password=secret123"

$.ajax({
    url: "/users",
    type: "POST",
    data: $("form").serialize()
});