title: jquery click event executes multiple times in single click
body: <p>I have a template file which gets dynamically included inside two or more <code>DIV</code> in single page:
  divs will be AS below :
                    1. VIEW div
                    2. EDIT div
                 other can be - RESOLUTION div ...    </p>
  
  <p>EDIT div is <code>display none</code> while VIEW div appear and reversal. so, only one can be appear at a time.</p>
  
  <p>template file contains below javascript:</p>
  
  <pre><code>   AJS.$(document).on('click', '#addROW', function()
     {
        console.log('calling');
        ....
        ..
     }
  </code></pre>
  
  <p>now, when i click on <code>add</code> button (existed in template file) then it executes above event and it should add a single row and print a log message but, it executes doubles so, initially executes two times (as template included in two screens) and prints two times message 'calling' and after some times, it gets double 4 times executes. I expect it should executes one time only and prints 'calling' message once only.</p>
  
  <p>How can i resolve this issue.</p>
  
  <p>It looks like due to javascript is added multiple times.. but how can i control to add it single times into the page or any other way to resolve this issue ?</p>
  
  <p>Thank You</p>