title: three js clickable objects
body: <p>I have two 3d objects "meshes" that I created in three.js. 
  I want to add click event to these objects so that when I click on one of them, it is scaled up and when I click on the other one, it rotates.</p>
  
  <p>I tried this method to add a click event to an object and it's not working.</p>
  
  <pre><code>&lt;script src='threex.domevent.js'&gt; &lt;/script&gt;
  &lt;script&gt;
  
          var scene = new THREE.Scene();
          var camera = new THREE.PerspectiveCamera(20, window.innerWidth/window.innerHeight, 1, 1000);
          camera.position.z = 100;
  
          var renderer = new THREE.WebGLRenderer();
          renderer.setSize(window.innerWidth, window.innerHeight);
          document.body.appendChild(renderer.domElement);
  
          var geometry = new THREE.CubeGeometry(1,1,1);
          var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
          var cube = new THREE.Mesh(geometry, material);
          scene.add(cube);
  
          cube.addEventListener( 'click',function(){cubeScale()} , false );
  
          function cubeScale()
              {
              cube.scale.x *= 20;
              }
  
  
          var render = function () {
              requestAnimationFrame(render);
              cube.rotation.y += 0.1;
              renderer.render(scene, camera);
          };
  
          render();
  
      &lt;/script&gt;
  </code></pre>