In view that you do not supply the complete code I have elaborated an example that works perfectly so that you observe where your error is. The example contains two buttons and a div. A click button makes the div disappear and the other button when pressed makes it reappear again.
This I have achieved with the functions of Jquery fadeIn and fadeOut. Maybe the error you are having is that you are using only one of them (you disappear the element more when you click again you do not capture the event to make it reappear again)
Here's the example:
$("#fadein").click(function(){
$("#caja").fadeIn("slow");
});
$("#fadeout").click(function(){
$("#caja").fadeOut("slow");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" name="fadein" id="fadein" value="aparece">
<input type="submit" name="fadeout" id="fadeout" value="desaparece">
<div id="caja" style="background-color:#ff0000; width:50%; margin-top:20%;"> Elemento que aparece y
desaparece
</div>
You also have a function that merges both fadeIn and fadeOut and is called fadeToggle so you only need to press a button to make it disappear and then press the same button again to make it appear. That works as I show you next:
$("#fadein").click(function(){
$("#caja").fadeToggle("slow");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" name="fadein" id="fadein" value="unico">
<div id="caja" style="background-color:#ff0000; width:50%; margin-top:20%;"> Elemento que aparece y
desaparece
</div>
For the purposes of your code, it only changes:
this.$dtpElement.addClass('hidden');
for the fade event like this:
this.$dtpElement.fadeToggle("slow");