jQuery function callback does not work in custom class/object

Question

So am a newbie to programming so excuse me if this is a novice question. I am creating a simple wave effect to create an illusion of moving water. I did this with a simple function in jquery and it worked fine. I am learning OOP so my code is more organized for this project I am working on. I created a class to handle this animation. The animation works but it only fires once. I need it to keep firing to create the illusion. The function callback works the normal procedual way but it does not seem to work within the object class. I have researched this and researched this and can not find an answer for this specific problem. Any help would be much appreciated. My code is below.

    function Waves(selector){
      this.selector = selector;
      this.animateWaves = function(forward,backward,speed){
        $(selector).velocity({translateX: forward},speed); 
        $(selector).velocity({translateX: backward},speed,animateWaves);
      };
    };
   var surfaceWaves = new Waves('#topWaves');
   surfaceWaves.animateWaves('+=40','-=40','1000');

Answer 1

EDIT Actually, my first solution does not work because the context of the callback is the element, not the object. Here is the working code and a jsfiddle:

function Waves(selector){
  this.selector = selector;
  this.animateWaves = function(forward,backward,speed){
    var self = this; 
    $(selector).velocity({translateX: forward},speed); 
      $(selector).velocity({translateX: backward}, speed, function () {
          self.animateWaves(forward,backward,speed);
      });
  };
};
var surfaceWaves = new Waves('#topWaves');
surfaceWaves.animateWaves('+=40','-=40','1000');

---

Removed old code incorrect code