失礼します。本当に初歩的な質問なのですが、
CodePenで見つけた、蛍のようなオブジェクトがふわふわ舞うようなエフェクトをWordPressに取り入れたいのですが全くうまくいきません。

function RN(x){
  return Math.random()*x;
}
// lower total if your computer is bad
var total = 250 ;
var w = window.innerWidth;
var h = window.innerHeight;
var target = document.getElementById('container');
for (i=0; i<total; i++){
 var e = document.createElement('div');
 e.className = "dot";
 e.opacity = 0;
 e.style.left = RN(w)+'px';
 e.style.top = RN(h)+'px';
 target.appendChild(e);
 animm(e);
}
function animm(elm){
  TweenMax.killTweensOf(elm);
  TweenMax.to(elm, (RN(80))+40, {
 bezier:{
  curviness:3,
  values:[
   {left:RN(w), top:RN(h)},
   {left:RN(w), top:RN(h)}
  ]
 },
 onComplete:function(){
   TweenMax.delayedCall(RN(2), animm, [elm]);
 }
  });
  TweenMax.to(elm, (RN(4)+2),{
 force3D:"auto",
 opacity:RN(.7)+.1,
 repeat:-1,
 scale:RN(1.25)+.25,
 yoyo:true,
 ease:Bounce.easeInOut
  });
};
img{
  left:50%;
  top:50%;
  position:absolute;
}
body{
  background-color:black;
}
html, body, #container {
width:100%; 
height:100%;
}
.dot{
  width:2px;
  height:2px;
  position:absolute;
  background:#0ff;
  box-shadow:0px 0px 10px 2px #8ff;
  border-radius: 50% 50%;
  z-index:2;
}
<div id="container"></div>

となっています。どのように改変すればいいでしょうか?
よろしくお願いします。