I am trying to create a hotel booking form with an increment counter which I have already setup. Its got 3 input fields and at the end there is a "group total" text input field. I need to ask if anyone could help me with the JS in order to counter the number of individuals in the total group box for when they incrementally add people in the 3 increment counters?

My code is as follows:

```js
function increase() {
  var a = 1;
  var textbox = document.getElementById("text");
  textbox.value++;
}

function decrease() {
  var textBox = document.getElementById("text");
  textBox.value--;
}

function increase2() {
  var a = 1;
  var textbox2 = document.getElementById("text2");
  textbox2.value++;
}

function decrease2() {
  var textBox2 = document.getElementById("text2");
  textBox2.value--;
}

function increase3() {
  var a = 1;
  var textbox3 = document.getElementById("text3");
  textbox3.value++;

}

function decrease3() {
  var textBox3 = document.getElementById("text3");
  textBox3.value--;
}
```

```html
<h4>Please select the number of people who will be in each room</h4>

<div class="cart-plus-minus">
  <button type="button" onclick="decrease()">-</button>
  <input type="text" id="text" value="1" min="1" data-max="2" readonly>
  <button type="button" onclick="increase()">+</button>
</div>

<div class="cart-plus-minus">
  <button type="button" onclick="decrease2()">-</button>
  <input type="text" id="text2" value="1" min="1" max="2" readonly>
  <button type="button" onclick="increase2()">+</button>
</div>

<div class="cart-plus-minus">
  <button type="button" onclick="decrease3()">-</button>
  <input type="text" id="text3" value="1" min="1" max="2" readonly>
  <button type="button" onclick="increase3()">+</button>
</div>
<a href="" class="a-link">
  <label> Group Total: </label>
  <input id="totalPersons" type="text" placeholder="" value="">
</a>
```