title: how to send through onclick="function(this)"
body: <p>Okay, so I have got two problems here. First I will show you the html.</p>
  
  <pre><code>&lt;div id="servicesAvailable"&gt;
      &lt;div&gt;
          &lt;input type="text" name="servicesAvailable[]"&gt;
          &lt;i class="fa fa-plus-circle"&gt;&lt;/i&gt;     
          &lt;span&gt;Add another service&lt;/span&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Okay so i want the user to be able to click the '.fa-plus-circle' class to add another div inside #servicesAvailable.</p>
  
  <p>So i did this:(i know that people will say why dont you write $() instead of jQuery(), but its fine like this).</p>
  
  <pre><code>jQuery('fa-plus-circle').click(function(){
      jQuery('#servicesAvailable').append(
          '&lt;div&gt;
               &lt;input type="text" name="servicesAvailable[]" onclick="addServices(this)"&gt;
               &lt;i class="fa fa-plus-circle"&gt;&lt;/i&gt;
               &lt;span&gt; Add another service&lt;/span&gt;
          &lt;/div&gt;'
      );
      jQuery(this).next().hide();
      jQuery(this).hide();
  
  });
  </code></pre>
  
  <p>Ok so with this it should work fine. It actually works the first time i click the class. Then when i click on the fa-plus-circle class on the new appended section it just doesn't do anything. Even if i put console.log('here'); inside the jQuery click function it doesn't log.  </p>
  
  <p>So to start of if anyone can point out something i did wrong there then great!.</p>
  
  <p>However i have tried now to change the way i do this to get it to work which leads the the title question 'how to send through onclick="function(this)"'</p>
  
  <pre><code>&lt;div id="servicesAvailable"&gt;
      &lt;div&gt;
          &lt;input type="text" name="servicesAvailable[]"&gt;
          &lt;i class="fa fa-plus-circle" onclick="addServices(this)"&gt;&lt;/i&gt;     
          &lt;span&gt;Add another service&lt;/span&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
          function addServices(this)
          {
              jQuery('#servicesAvailable').append(
                  '&lt;div&gt;
                       &lt;input type="text" name="servicesAvailable[]" onclick="addServices(this)"&gt;
                       &lt;i class="fa fa-plus-circle"&gt;&lt;/i&gt;
                       &lt;span&gt; Add another service&lt;/span&gt;
                   &lt;/div&gt;'
              );
              this.next().hide();
              this.hide();
          }
  </code></pre>
  
  <p>now straight away in the console before i do any thing is has</p>
  
  <pre><code>Uncaught SyntaxError: Unexpected token this
  function addServices(this)
  </code></pre>
  
  <p>Can anyone advise what i am doing wrong in either cases to get this to work please?</p>
  
  <p>Ill admit i'm not 100% which the second way but i'm pretty sure the first attempt should work.</p>