title: How do you pass variables as arguments in a function call within HTML attributes?
body: <p>Using Javascript, I'm trying to run a loop that creates elements with html attributes that when clicked triggers another function and passes variables as arguments.  </p>
  
  <p><a href="http://jsfiddle.net/2PFBE/2/" rel="nofollow">HERE'S A FIDDLE</a></p>
  
  <p>Ideally in this example Funky() would be called when clicking a letter and log something like: <code>c word_2</code> Unfortunately I'm getting either <code>Funky is not defined</code> or <code>c is not defined</code>  When I run something very similar to this off of fiddle I get <code>[object HTMLInputElement][object HTMLSpanElement]</code>  How do u properly do this sort of thing?   </p>
  
  <pre><code>function Funky(letter, word) {console.log(letter + " " + word)} 
  
  var arr = ['a','b','c','d','e','f','g','h','i','j','k','l','m']
  var recollection = "";
  
  for(x=0; x&lt;arr.length; x++){
      recollection += '&lt;p onclick="Funky('+arr[x]+', word_'+x+')"&gt;' +arr[x]+ '&lt;/p&gt;';
      }
  </code></pre>