Replace text issue in javascript

Question

I want to check if the text exist and remove it. I need to find if the text exist and remove the parent items. For example If the the With Name + Date exist then remove :

<dt>Font</dt>
<dd>Arial </dd>

Another example if the With Name + Date + Time exist then remove:

<dt>Font</dt>
<dd>Comic Sans </dd>

My code:

jQuery( document ).ready(function() {
  if (jQuery('.item-options dd:contains("With Name")').length > 0)
  {
    var parent = jQuery('.item-options dd:contains("With Name")').parent('dl');
    jQuery(parent).find('dt:contains("Font")').html('');    
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name </dd>
  <dt>Font</dt>
  <dd>no font selected </dd>
</dl>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name + Date</dd>
  <dt>Font</dt>
  <dd>Arial </dd>
</dl>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name + Date + Time</dd>
  <dt>Font</dt>
  <dd>Comic Sans </dd>
</dl>

My issue is because With Name exist in all and my javascript is apply to all. How I can make the javascript to search exactly?

Possible duplicate of make jQuery's `:contains()` select only exact string — Phiter
– Phiter, Commented Apr 15, 2016 at 17:14

Community · Accepted Answer · 2017-05-23 10:28:35Z

1

You can use jQuery's filter function. The contains selector will not try to get an exact match, but, like the name says, a string that contains the desired text.

jQuery( document ).ready(function() {
  if (jQuery('.item-options dd').filter(function() {
    return jQuery(this).text() === "With Name";
  }).length > 0)
  {
    var parent = jQuery('.item-options dd:contains("With Name")').parent('dl');
    jQuery(parent).find('dt:contains("Font")').html('');    
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name </dd>
  <dt>Font</dt>
  <dd>no font selected </dd>
</dl>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name + Date</dd>
  <dt>Font</dt>
  <dd>Arial </dd>
</dl>
<dl class="item-options">
  <dt>Radio test</dt>
  <dd>With Name + Date + Time</dd>
  <dt>Font</dt>
  <dd>Comic Sans </dd>
</dl>

Looks ugly, but works.

Source

edited May 23, 2017 at 10:28

CommunityBot

11 silver badge

answered Apr 15, 2016 at 17:12

Phiter

15k14 gold badges52 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Robert Over a year ago

Hi phiter thank you so much, but I don't know why the code is not work.

Robert Over a year ago

Hi Phiter Fernandes can you tell what is wrong with this code and why Font text is not removed? I try it in my page too and is the same like here, if you press Run code snippet you will see that the Font is still there. Thank you

Phiter Over a year ago

I will take a look at it.

Robert Over a year ago

thannk you so much

Robert Over a year ago

Phiter Fernandes I manage to make it work but this code will remove Font from everywhere, I need to be removed only in the item where exist just the text With Name simple.

DK3 · Accepted Answer · 2016-04-15 17:38:31Z

0

if you know the html architecture or otherwise remove whatever you want.i hope this will help you.

$( document ).ready(function() {
 if ($('.item-options dd:contains("With Name")').length > 0)
  { 
   var parent = $('.item-options');
   var children = $('.item-options').find("dd");
   $(children).each(function(i,e){
    if(~$(e).text().indexOf("With Name + Date + Time")){
     $(e).nextAll().remove();
    }
   else if(~$(e).text().indexOf("With Name + Date")){
     $(e).nextAll().remove();
    }
  });

 }
});

https://jsfiddle.net/atg5m6ym/3270/

answered Apr 15, 2016 at 17:38

DK3

4032 silver badges10 bronze badges

2 Comments

Robert Over a year ago

Hi thank you for your answer, but what happens if the With Name is not exist and there is only With Name + Date + Time? I try and if With Name is not exist is remove the script remove everything that contain With Name

Robert Over a year ago

Hi, can you tell me how I can remove only the text Font? in your code? instead this $(e).nextAll().remove(); I need to remove only text Font

Collectives™ on Stack Overflow

Replace text issue in javascript

2 Answers 2

5 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related