My users have access to a form.

To simplify the task I put a selectable list but if the answer is not in the list, they can add a reason manually

The selectable list is required by default
but if the user accesses the text field it becomes required and the list is no longer required (and vice versa).

HTML:

```
<div class="form-group">
  <select name="motif" class="form-control input-lg" required>
    <option selected="true" disabled="disabled" value="">Select</option> 
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
  </select>
</div>

<div class="form-group">
  <input name="messagetick" id="messagetick2" type="checkbox" value="yes" /> Other
</div>
<div id="motif-reject" class="form-group" style="display: none">
  <textarea class="form-control" rows="5" placeholder="reason" name="motif-text"></textarea>
</div>

```

JS:

```
$('input[name="messagetick"]').click(function() {
    $('#motif-reject').toggle(this.checked);
});

```

You can see the JsFiddle:
<https://jsfiddle.net/rkkdhant/>

I do not know how to do with a toggle, can you help me?