Is there a way to reset the .replaceWith function so that the html, css and javascript elements are restored to their original state?
I am looking to have an icon replace the text when the user clicks on "contact", and then have the text return when the user clicks on the "back" button. Currently, the icon switches back to text, but the function does not work properly if I try to repeat it a second time.
Here is the HTML code:
<div class="contact">Contact</div>
<button class="back">Back</button>
And the Javascript code:
var contactswitch = $('<div class="icon"><i class="fa fa-facebook"></i></div>');
var switchback = $('.contact');
$('.contact').click(function() {
$(this).replaceWith(contactswitch)
});
$('.back').click(function() {
$(contactswitch).replaceWith(switchback)
});
Thank you!