Передача аргумента скрипту в HTML

Есть поле ввода кода и кнопка Добавить. Кнопка берет значение с поля ввода, а как сделать так, чтобы отдельная кнопка передавала свое значение? Т.е. пользователь вводит код курса и добавляет его к себе. А как сделать кнопку, которая добавит определенный курс?

Вот поле ввода кода:

<div class="input-group">
      <input type="text" id="group-id" class="form-control" placeholder="Введите сюда код класса. Например: 182967">
      <span class="input-group-btn">
        <button class="btn btn-default" type="button" onclick="groupsAdd()">Добавить</button>
      </span>
    </div>

А вот скрипт выполнения:

function groupsAdd(gid){
    var gid = trim($('#group-id').val());
        $.ajax({
            type:'post',
            url:'/func_student.php',
            dataType:'json',
            data:{'action':'groupsAdd','gid':gid,'user_id':user_id},
            success:function(j){
                var r = j['r'];
                if (r != 200){
                    var txt = '';
                    if (r == 1) txt = "Вы неверно ввели код группы";
                    else if (r == 2) txt = 'Вы уже состоите в этой группе';
                    swal({
                        title: "",
                        text: txt,
                        type: "error"
                    });
                } else {
                    window.location.href='';
                }
            }
        });
}

Вот что я хочу исправить:

<button class="btn btn-default" type="button" id="group_id" value="1481472" onclick="groupsAdd()" >Пробный урок</button>