Add more field using #ajax framework in Drupal 7

angular_refresh.admin.inc

<?php
/**
 * @file
 * Angular View admin file.
 */

function angular_refresh_endpoints($form, &$form_state, $no_js_use = FALSE) {
  $form['#attached']['css'] = array(
    drupal_get_path('module', 'angular_refresh') . '/angular_refresh.css',
  );

  // Because we have many fields with the same values, we have to set
  // #tree to be able to access them.
  $form['#tree'] = TRUE;
  $form['names_fieldset'] = array(
    '#type' => 'fieldset',
    '#title' => t('URL Endpoints'),
    '#attributes' => array(
      'class' => array('wetwew'),
    ),

    // Set up the wrapper so that AJAX will be able to replace the fieldset.
    '#prefix' => '<div id="names-fieldset-wrapper">',
    '#suffix' => '</div>',
  );

  // Build the fieldset with the proper number of names. We'll use
  // $form_state['num_names'] to determine the number of textfields to build.
  if (empty($form_state['num_names'])) {
    $form_state['num_names'] = 1;
  }
  for ($i = 0; $i < $form_state['num_names']; $i++) {
    $form['names_fieldset']['test'] = array(
      '#prefix' => '<div clas="what-' . $i . '">',
      '#suffix' => '</div>',
    );

    $form['names_fieldset']['test']['url_name'][$i] = array(
      '#type' => 'textfield',
      '#title' => t('Endpoint Name'),
    );

    $form['names_fieldset']['test']['name'][$i] = array(
      '#type' => 'textfield',
      '#title' => t('URL Endpoint'),
    );
  }

  $form['names_fieldset']['add_name'] = array(
    '#type' => 'submit',
    '#value' => t('New Endpoint'),
    '#submit' => array('angular_refresh_add_more_add_one'),
    '#attributes' => array(
      'class' => array('angular-refresh-new-endpoint'),
    ),
    '#ajax' => array(
      'callback' => 'angular_refresh_add_more_callback',
      'wrapper' => 'names-fieldset-wrapper',
    ),
  );
  if ($form_state['num_names'] > 1) {
    $form['names_fieldset']['remove_name'] = array(
      '#type' => 'submit',
      '#value' => t('Remove one'),
      '#submit' => array('angular_refresh_add_more_remove_one'),
      '#ajax' => array(
        'callback' => 'angular_refresh_add_more_callback',
        'wrapper' => 'names-fieldset-wrapper',
      ),
    );
  }
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );

  return $form;
}

function angular_refresh_add_more_remove_one($form, &$form_state) {
  if ($form_state['num_names'] > 1) {
    $form_state['num_names']--;
  }
  $form_state['rebuild'] = TRUE;
}


function angular_refresh_add_more_add_one($form, &$form_state) {
  $form_state['num_names']++;
  $form_state['rebuild'] = TRUE;
}


function angular_refresh_add_more_callback($form, $form_state) {
  return $form['names_fieldset'];
}

function angular_refresh_add_more_submit($form, &$form_state) {
  krumo($form_state);
  exit;
}

angular_refresh.info

name = Angular Refresh
description = Refresh content without reloading the page.
version = 7.x-1.0
core = 7.x
configure = admin/config/content/angular-endpoints

angular_refresh.module

<?php
/**
 * @file
 * Angular refresh module file.
 */

/**
 * Implements hook_menu().
 */
function angular_refresh_menu() {
  $items['admin/config/content/angular-endpoints'] = array(
    'title' => 'Angular Refresh Endpoints',
    'description' => 'Endpoint URL to where the json-data will be served from.',
    'page callback' => 'drupal_get_form',
    'page arguments' => array('angular_refresh_endpoints'),
    'file' => 'angular_refresh.admin.inc',
    'access arguments' => array('administer angular refresh'),
    'type' => MENU_NORMAL_ITEM,
   );

  return $items;
}


/**
 * Implementation of hook_permission().
 *
 * People -> Permissions
 */
function angular_refresh_permission() {
  $arr = array();
  $arr['administer angular refresh'] = array(
    'title' => t('Administer Angular Refresh module'),
    'description' => t('Allow users to administer json-data endpoints.')
  );

  return $arr;
}

style.css

.form-item-names-fieldset-url-name-0,
.form-item-names-fieldset-name-0 {
  float: left;
}

#ajax-example-add-more .form-item-names-fieldset-name-0 {
  margin-left: 10px;
}

.angular-refresh-new-endpoint {
  clear: both;
  display: block;
}

.clear-float {
  clear: both;
}