title: javascript generate repeated images in meteor
body: <p>Can anyone help I am trying to have an image that repeats according to how many portions there are. I am getting Uncaught TypeError: Cannot set property 'src' of undefined.</p>
  
  <p>I am using meteor and react</p>
  
  <pre><code>genPrtnImg: function () {
   var pNum = FoodItemsC.find(this.props.foodItem.portionNo);
   for (i = 0; i &lt; pNum; i++)
    var img = document.createElement('img');
    img.src = "http://downloadicons.net/sites/default/files/carrot-icon-14142.png";
  return img;
  },
  </code></pre>
  
  <p>the function is called in the render below:</p>
  
  <pre><code>render() {
      return (
        &lt;tbody&gt;
          &lt;tr&gt;
            &lt;td rowSpan="3"&gt;&lt;img className="itemSmlPic" src="http://bed56888308e93972c04-0dfc23b7b97881dee012a129d9518bae.r34.cf1.rackcdn.com/sites/default/files/veggie-heart.jpg"&gt;&lt;/img&gt;&lt;/td&gt;
            &lt;td&gt;&lt;h1&gt;{this.props.foodItem.foodName}&lt;/h1&gt;&lt;/td&gt;
            &lt;td rowSpan="3"&gt;&lt;img className="itemSmlPic" src="http://thesocialmediamonthly.com/wp-content/uploads/2015/08/photo.png"&gt;&lt;/img&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;{this.props.foodItem.foodDesc}&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;{this.genPrtnImg()}&lt;/td&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
      );
    }
  </code></pre>
  
  <p>Thanks!</p>