Question: ```
var labelSub = $('.form-group > .custom-control > label');

// if <ul> element next to <label> exists, append <a> to a <label>            
if (labelSub.next('ul').length > 0) {
   labelSub.append('<a href="javascript:void(0);" class="toggle-button-sub" data-toggle="collapse" role="button">+</a>');
}

```

It appends anchor to all `<label>` elements. I also tried `if (labelSub.next('ul').length)` and `if (labelSub.next('ul').length !== 0)`

Answer: 
You need to validate the existence of the next `ul` in the current element context and append elements to it.

A simple approach would be to iterate the labels.

```
var labelSub = $('.form-group > .custom-control > label');

//Iterate each labels
labelSub.each(function(index, element) {
  //If it doesn't has next element, then append
  if ($(element).next('ul').length > 0) {
    $(element).append('<a href="javascript:void(0);" class="toggle-button-sub" data-toggle="collapse" role="button">+</a>');
  }
});

```

```js
var labelSub = $('.form-group > .custom-control > label');

//Iterate each labels
labelSub.each(function(index, element) {
  //If it doesn't has next element, then append
  if ($(element).next('ul').length > 0) {
    $(element).append('<a href="javascript:void(0);" class="toggle-button-sub" data-toggle="collapse" role="button">+</a>');
  }
});
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <div class="custom-control">
    <label>Here's the label - Don't append.</label>
  </div>
  <div class="custom-control">
    <label>Here's the label - Appended here.</label>
    <ul>
      <li>Here is the ul</li>
    </ul>
  </div>
  <div class="custom-control">
    <label>Here's the label - Don't append.</label>
  </div>
</div>
```
Completed the code with additional HTML and seems to be working as intended. Are the `label` and `ul` elements in the right order? e.g. .prev vs .next?

```js
var labelSub = $('.form-group > .custom-control > label');

// if <ul> element next to <label> exists, append <a> to a <label> 
console.log(labelSub.next('ul'));
if (labelSub.next('ul').length > 0) {
  labelSub.append('<a href="javascript:void(0);" class="toggle-button-sub" data-toggle="collapse" role="button">+</a>');
}
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <div class="custom-control">
    <label>Here's the label.</label>
    <ul>
      <li>Here is the ul</li>
    </ul>
  </div>
</div>
```