title: Handle jquery button click with multiple buttons with same class on same page
body: <p>So i have a function that i have build for some kind of repeatable text boxes that i can add and remove with click on a button.</p>
  
  <p>But my problem is that now when i want to have 2 separated repeatable boxes on same page i can't separate click on button event.</p>
  
  <p>This is output i use for repeatable options box.</p>
  
  <pre><code>$output .= '&lt;div class="option"&gt;';
  $output .= '&lt;div class="vf-sortable-holder"&gt;';
  $output .= '&lt;div class="vf-sortable vf-repeat-text empty-sortable hidden"&gt;&lt;span class="ui-icon ui-icon-arrowthick-2-n-s"&gt;&lt;/span&gt;';
  $output .= '&lt;input id="' . esc_attr( $value['id'] ) . '" class="vf-input" data-rel="' . esc_attr( $option_name . '[' . $value['id'] . ']' ) . '" type="text" value="' . esc_attr( $value['std'] ) . '" /&gt;';
  $output .= '&lt;a class="vf-delete-sortable button" href="#"&gt;'. __('Remove') .'&lt;/a&gt;';
  $output .= '&lt;/div&gt;';
  
  $output .= '&lt;/div&gt;';
  $output .= '&lt;a class="vf-new-sortable button" href="#"&gt;Add new&lt;/a&gt;';
  $output .= '&lt;/div&gt;';
  </code></pre>
  
  <p>And this is js function that i use to add a new text box</p>
  
  <pre><code>//Add new field for repeatable option
  $('.vf-new-sortable').click( function(event) {
  
      //Get parent element
      var loop = $(this).closest('.option');
  
      // Count all repeat group div's
      var count = loop.find('.vf-sortable').not('.empty-sortable').length;
  
      //Add new slide
      var new_slide = loop.find('.empty-sortable').clone(true).removeClass('empty-sortable hidden').insertBefore('.empty-sortable');
  
      var input = new_slide.find('input');
  
      var input_name = input.attr('data-rel');
      input.attr('name', input_name + '[' + ( count ) + ']');
      return false;
  });
  </code></pre>
  
  <p>What this should do is when page is loaded to have one vf-sortable div hidden and when i click on button it should clone it and make another vf-sortable field.</p>
  
  <p>And this works. But problem is when i output 2 or more option div's with sortable boxes on button click it add new vf-sortable box on every option. how do i make event only to work on specific option div where add button is clicked?</p>