javascriptについて質問です。 

<!DOCTYPE html>
<html lang="ja">
<head>
<title>javaスクリプト</title>
<meta charset="utf-8">
</head>
<style>
body {
display: flex;
flex-wrap: wrap;
}

.box{
width:100px;
height:100px;
background: skyblue;
cursor: pointer;
transition: 0.8s;
margin: 0 8px 8px 0;

}
.circle{
background:red;
border-radius: 50%;
transform: rotate(360deg);
}
</style>
<body>
<script>
'use strict' ;

const div=ducument.createElement('div');
div.classList.add('box');
div.addEventListener('click , function() { 　←ここが間違ってるみたい
div.classList.toggle('circle');
});


document.body.appendChild(div);


</script>
</body>
</html>

という感じでドットインストールを見ながら作ったんですがドットインストールでは青い四角の図のようなものがでてくるんですが
自分のブラウザで開くと何も出てきません。そして開発者ツールで調べてみるとエラーが出ていてSCRIPT1015: SCRIPT1015: Unterminated string constantと書いてあります。
div.addEventListener('click , function(); { というところがさされていました。
どうゆうことなんでしょうか教えてください。