title: using jquery in three.js
body: <p>Thanks again guys for the previous help, but again, I need your help.
  Now I have markers on my map, just like I wanted. But, now these markers need to be clickable. In fact, they need to show another div when clicked (so jquery needed).</p>
  
  <p>I have tried it like this:</p>
  
  <p>First, I started with putting my canvas in a div with an id:</p>
  
  <pre><code>    container = document.createElement( 'div' );
      container.setAttribute("id", "driedkaart");
      document.body.appendChild( container );
  </code></pre>
  
  <p>Then, by adding the markers like this:</p>
  
  <pre><code>// ADD SPRITES FOR MARKERS
  var pin = THREE.ImageUtils.loadTexture( 'pin.png' );
  
  var marker = new THREE.SpriteMaterial( { map: pin } );
  var sprite = new THREE.Sprite( marker );
  sprite.position.set( 1.3, 1.9, -1.7 );
  sprite.scale.set(0.2, 0.6, 0.5 );
  
  var marker = new THREE.SpriteMaterial( { map: pin } );
  var sprite1 = new THREE.Sprite( marker );
  sprite1.position.set( -2.3, 1.9, -1.9 );
  sprite1.scale.set(0.2, 0.6, 0.5 );
  
  //Group the markers to set them relative to the map
  
      group = new THREE.Object3D;
      group.add(sprite);
      group.add(sprite1);
      scene.add(group);
  </code></pre>
  
  <p>And now, I want to make them clickable (jquery is linked correctly):</p>
  
  <pre><code>    sprite = document.createElement('img');
      sprite.setAttribute("id", "Eersteslagomieper");
      sprite.src = 'pin.png';
      document.body.appendChild(sprite);
  </code></pre>
  
  <p>This creates the img after the canvas. But I need the sprite (on the map) to be clickable.</p>
  
  <p>ps: The marker image isn't set on point just yet, but don't worry about that :)</p>
  
  <p>Thanks again</p>
  
  <p>live code: <a href="http://www.bensjitestsite.site50.net" rel="nofollow">http://www.bensjitestsite.site50.net</a></p>