gistfile1.md

Tinder Templating Continued

Directions

1. Create a template that generates html in the format below, but allowing for dynamic values to be inserted for the img tag's src attribute, as well as the text of the span tag:

<div class="match clearfix">
  <img src="http://api.randomuser.me/portraits/women/2.jpg" alt=""><span>Sarana</span>
</div>

2. Use this template to generate a string of HTML, passing in a hardcoded image URL and name.
3. Append this new html to the div with the class of "matches-container".
4. Once your template works as expected--i.e. a match appears in the left-hand column--add a click event listener to the heart button, so that whenever it's clicked, the rando on the screen is added to the match column, and a new rando takes their place on the iPhone.