In Meteor How to find a DOM element (after rendering)?

advertisements

I'm new to meteor.

I want to use JavaScript to copy text from an h1-element into a div-element.

I started with this:

cd /tmp
meteor create dad
cd dad
meteor deploy dad.meteor.com

I created a template:

<template name='dad1'>
  <h1 id='id1'>hello</h1>
  <h2 id='id2'>world</h2>
</template>

I wroted some js:

// dad1.js
if (Meteor.isClient) {
  Template.dad1.onRendered(function(){
    var myh1 = this.find('id1');
    var myh2 = this.find('id2');})}

When I step through the above js in my browser both myh1 and myh2 stay null.

Question: How to find a DOM element (after render) so I can operate on it?


The template's find method takes a CSS selector as the argument, so you'd need to pass #id1 instead of id1.