title: JQuery: Calling a Function Dynamically
body: <p>I have attached a onClick event handle to a tag. On click, I wanted to pick-up an attribute -- let's say, fn; and I want to call the function mentioned as the attribute value.</p>
  
  <p>The following code does not work </p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"&gt;&lt;/script&gt;
      &lt;script language="JavaScript"&gt;
          var Test = Test? Test : new Object();
          $(document).ready(function(){
              Test.main();
          })
          Test.sub = function(){
              alert('called');
          }
          Test.main = function(){
              $('.caller').click(function(e){
                  e.preventDefault();
                  var fn = $(this).attr('fn');
                  alert('calling: '+fn);
                  return fn();
              });
          }
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;a class="caller" fn="Test.sub" href="#"&gt;test call&lt;/a&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My questions are</p>
  
  <ul>
  <li>Is it possible?</li>
  <li>What am I doing wrong?</li>
  <li>What could be right approach to solve this issue?</li>
  </ul>
  
  <p>Thanks<br>
  Nishant</p>