Let's say that we have the next block of code. If I want/need to add a custom('home made') class to the parent div what are the best practices?

To be more explicit.

I want to target this block of code inside a Javascript variable. How should I name the class-name to be easily recognized by other developers as a custom class inside Bootstrap?

Should I go with a prefix like custom- followed by the name of the class? (custom-class-name)

Should I use the BEM convention? I would like to know what are your thoughts on this.

var someVar = document.getElementsByClassName('class-name');

<div class="input-group mb-3">
  <span class="input-group-text" id="basic-addon1">@</span>
  <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
</div>