<div id="box" onclick="startCSSAnimation();"> </div>
<style>
	#box {
        position: relative;
        left: 0;
    }
    #box.move {
        left: 100%;
        transition-property: left;
        transition-duration: 1s;
        transition-timing-function: linear;
    }
</style>
<script>
	(function(){

        // グローバル関数
        window.startCSSAnimation = startAnimate;

        var box = document.getElementById("box");

        // アニメーション開始
        function startAnimate() {
            box.classList.add("move");
            box.addEventListener("webkitTransitionEnd", completeAnimate, false);
        };

        // アニメーション終了
        function completeAnimate() {
            box.classList.remove("move");
        };

    })();
</script>