Hi I am trying for hours now to remove a text string again after I have appended it.
I have a script that handles an accordion and I have some redundancy in text in it. So I want to add and remove the redundant text on opening or closing the accordion row.
Here is my code:
var redundantText = "text text text <a href=\"#contact\">Contact Me</a> text text text";
$('#collapse_1').on('show.bs.collapse', function() {
$(".dropdown_collapse_1").addClass("dropdown-indicator");
$(".dropdown_collapse_1").removeClass("dropdown-collapsed");
$("#redundant_text_wrapper").append(redundantText);
});
$('#collapse_1').on('hide.bs.collapse', function() {
$(".dropdown_collapse_1").addClass("dropdown-collapsed");
$(".dropdown_collapse_1").removeClass("dropdown-indicator");
$("#redundant_text_wrapper").text().replace(redundantText, '');
});
The append works fine but the text().replace() does not. So if I open and close the accordion row several times it always appends the redundantText but never removes it so that the redundantText gets even more redundant.
Edit: changed 'redundantText' to redundantText. Still does not work
Edit2:
$("#redundant_text_wrapper").text($("#redundant_text_wrapper").text().replace(redundantText,''));
also does not help, it only removes the link but the text stays
Edit3:
$( "#redundant_text_wrapper").text(function(index, currentText) {
return currentText.replace(redundantText,'');
});
also does only remove the link, text stays
Ok, I tried a different approach now:
var redundantText = "<span id=\"redundantText_wrapper\"> text text text <a href=\"#contact\">Contact Me</a> text text text</span>";
$('#collapse_1').on('show.bs.collapse', function() {
$(".dropdown_collapse_1").addClass("dropdown-indicator");
$(".dropdown_collapse_1").removeClass("dropdown-collapsed");
$("#redundant_text_wrapper").after(redundantText);
});
$('#collapse_1').on('hide.bs.collapse', function() {
$(".dropdown_collapse_1").addClass("dropdown-collapsed");
$(".dropdown_collapse_1").removeClass("dropdown-indicator");
$('#redundantText_wrapper').remove();
});
So basically I use 'after' instead of 'append' and put the text into a span with ID. Now I can use $('#ID').remove(); to get rid of it on closing the tab.