Javascript 使用按钮单击来设置移动实体的材质

嗨，我正在尝试将圆向左和向右移动，这是我尝试的方法，我得到的结果是正确的，x的值为600，但是圆没有改变它的位置，可能它与draw函数有关，因为它已经被绘制了？我对这个很陌生，有人能帮我找出什么地方不对吗？或者有没有更好的方法使用按钮从左向右移动对象

function Particle(x, y, r) {
this.hue = random(360);
var options = {
    restitution: 0.8,
    friction: 0
}
x = 300;
this.body = Bodies.circle(x, y, r, options);
this.body.label = "particle";
this.r = r;
World.add(world, this.body);
$('#moveR').click(function() {
    for (i = x; i <= WIDTH; i++) {
        x = i;
        console.log(x);
    }
});

函数粒子（x，y，r）{
this.hue=随机（360）；
变量选项={
归还：0.8，
摩擦力：0
}
x=300；
this.body=Bodies.circle（x，y，r，选项）；
this.body.label=“particle”；
这个。r=r；
添加（World，this.body）；
$（'#moveR'）。单击（函数（）{
对于（i=x；我可以提供fiddle吗？嗨，我现在有一个实时url，球不能从左向右移动来控制球的下落。