image appear random position in jquery

In this step of a Whack-a-Mole class project, http://ift.tt/2z4oIFJ, I am to make a mole appear in the #gamespace in random locations. These are the instructions (sciv is a dummy img):

--- To actually randomly move each mole, you will need to call your random number functions! Call each function once in the addMole() function and save the returned value to a variable (eg. xPos and yPos). Now that you have two random values, you will need to add a "style" attribute to the mole IMG tag. For example:

<img src="img/scify.jpg" style="" />

In this "style" attribute, you will need to add a "left" and "top" property. The values for each property will be your random numbers. When finished, the moles should appear all over #gamespace. Tweak the values of your random function to make the moles stay within the #gamespace. Do not copy this code. Use it as a guide. You should end up with something that looks like:

<img src="scify.jpg" style="top:'+yPos+'px;left:'+xPos+'px;" /> ----

This is my mole function. He tells me to make sure I have all my quotation marks closed but I don't understand how to do so within the parentheses unless there was a third type to use:

    var xPos;
    var yPos;
    function addMole(){
        $("#gamespace").append('<img src="img/mole.png" 
                                style="top:'+xPos+'px; left:'+yPos+'px;" />');
        randPosX();
        randPosY();
        t=setTimeout("addMole()", 2000);
    };//end mole