Edit in JSFiddle

// Get the canvas element
var canvas = document.getElementById("canvas");
// Get our 2D context for drawing
var ctx = canvas.getContext("2d");

// Frames-per-second
var FPS = 30;
var gravity = 8;
var startT = (new Date()).getTime();
// Particle object
var particle = {
    x: 30,
    y: 90,
    vx: 50,
    vy: -10,
    // Add ax and ay properties:
    ax: 100,
    ay: 60,
    radius: 20,
    color: "red",
    time: startT,
    draw: function () {
        ctx.beginPath();
        ctx.fillStyle = this.color;
        ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);
        ctx.fill();
    },
    update: function () {
        this.time = (new Date()).getTime();
        this.x += this.vx / FPS;
        var secs = this.time - startT;
        this.y = this.y + ((1 / 2 * this.vy) + gravity * Math.pow(secs / 1000, 2));
        if(this.y> 400){
            this.y = 90;
            this.x = 30;
            startT = this.time;
        }
    }
};

// Game loop draw function
function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    particle.draw();
}

// Game loop update function
function update() {
    particle.update();
}

function displayTime() {
    var show = document.getElementById('show');
    show.innerHTML = particle.time - startT;
}

function tick() {
    draw();
    update();
    displayTime();
}

setInterval(tick, 1000 / FPS);

<canvas id="canvas" width="500" height="300"></canvas>
<div id='show'>

#canvas {
    border: 2px solid #999;
    display: block;
    margin: 15px auto;
}