extra spaces being added with on click function through insertBefore

I have problem of too many spaces being added, seems like each click adds a space. With one click on the #main-edit area, it works correctly, one span for one space bar keypress. With two, two spans are added on one space bar keypress, and etc.

Here is the code:

$  ("#main-edit").click( function() {
var cursorExists = $  ("#cursor").length;
if (!cursorExists){
   $  cursorStart.append("<input type='text' id = 'cursor' />");
   $  ("#cursor").markCursor();

}
   if (cursorExists){
    $  ("#cursor").markCursor();

}

});

jQuery.fn.markCursor = function(e){
    $  (this).focus();
   $  (this).keyup(function(e) {
  $  cursorStart.enterText(e);

});

};

jQuery.fn.enterText = function(e){
var $  cursor = $  ("#cursor");
if (e.keyCode == 32){
    $  cursor.val("");
    $  ("<span class = 'space'>&nbsp</span>").insertBefore($  cursor);
}
};

newest questions tagged jquery – Stack Overflow