Datatable Destroy Not Working

html code

<table class="table" id="user_WDdata">
                    <thead class=" text-primary">
                    <tr>
                      <th>
                        Email
                      </th>
                        <th>
                        Wallet Addr
                      </th>
                          <th>
                        Amount
                      </th>
                          <th>
                        Apply Date
                      </th>
                      <th >
                        status
                      </th>
                      <th>
                       Message
                      </th>
            <th>Action</th>
            </tr>
            </thead>
          </table>

jquery code

 success:function(data)
     {
      $('#MsgModal').modal('toggle');
      $('#alert_message').html('<div class="alert-success">'+data+'</div>');
      $('#user_WDdata').DataTable().destroy();
      fetch_data();
     }

i want to destroy this datatable and reload the datatable through fetch_data() but is not destroying at all. what has happend? what i have done wrong