JavaScript How do I create several shrek images in a row?

So, I have a page, where when a user holds left mouse button, Shrek images are drawn where his/her cursor is. The problem is, only one picture is created when the mouse is down, but I need an ENDLESS CURRENT OF SHREKS.

Here is the code:

var shrekId = 0;

document.onmousemove = function(event) {
  mouseX = event.clientX;
  mouseY = event.clientY;
}

window.addEventListener('selectstart', function(e){ e.preventDefault(); });

document.body.onmousedown = function(event) {
  shrekId = 0;
  interval = setInterval(draw(event), 100);
}

document.body.onmouseup = function() {
  clearInterval(interval);
}

function draw(event) {
  this["img" + shrekId] = document.createElement("img");
  this["img" + shrekId].src = "http://pngimg.com/uploads/shrek/shrek_PNG3.png";
  this["img" + shrekId].style = "height: 100px; width: 100px; position: absolute; left: " + (mouseX - 50) + "px; top: " + (mouseY - 50) + "px; x-index: 100;";
  this["img" + shrekId].ondragstart = function() { return false; };
  document.body.appendChild(this["img" + shrekId]);
  shrekId += 1
}

setInterval() takes a function as a parameter, this is done by passing the function name (without the brackets) like so:

myFunc()
{
    console.log('hello');
    return 1;
}
setInterval(myFunc, 100);

When you do include the brackets (like you did in your example), it will run the function, take the return of that function, and provide that to the setInterval instead. For example:

myFunc()
{
    console.log('hello');
    return 1;
}
setInterval(myFunc(), 100);

turns into

setInterval(1, 100);

because myFunc() returns 1.

So you should be able to fix your code by removing the brackets from your interval:

interval = setInterval(draw(event), 100);
// to
interval = setInterval(draw, 100);

Which also means you have to remove the parameter from the function:

function draw(event) {
// to
function draw() {

The problem is with this line: interval = setInterval(draw(event), 100);

The first parameter of setInterval should be a function, but you're calling the function here and passing in the result, try the following instead:

interval = setInterval(() => { draw(event) }, 100);

Or if you aren't supporting ES6:

interval = setInterval(function() { draw(event) }, 100);

It doesn't look like you're using event inside of the draw function though, if that's the case you can just pass the draw function itself:

interval = setInterval(draw, 100);