Detect character in div and remove it Javascript or jQuery

Question

I have this div:

<h1>$340</h1>

I need to detect if inside of this div there is a dollar symbol,
If so - remove it

I'll explain again: I have got this code so far so I manage to detect if the symbol is in the div, but I can't figure how to remove it and update the DOM?

var sign = $('h1').text();

    if (sign.indexOf("$") >= 0) {
     //remove the sign
    }

possible duplicate of [How to see if string contains substring](http://stackoverflow.com/questions/3480771/how-to-see-if-string-contains-substring) — gmo, Mar 24 '15 at 12:51

score 2 · Answer 1 · answered Mar 24 '15 at 12:57

2

This is quite easy using a simple regex

var div = $('your selector here');
div.html(div.html().replace(/\$/g, ''));

answered Mar 24 '15 at 12:57

MarshallOfSound

2,629
1
20
26

score 1 · Answer 2 · answered Mar 24 '15 at 13:28

1

That's what I have meant, without the If condition:

$('h1').text( $('h1').text().replace("$", ''));

answered Mar 24 '15 at 13:28

user4571629

440
3
10
24

I'm Geeker · Answer 3 · 2015-03-24T13:02:31.073

0

Try like this

var price = $("h1").html().replace(/[^\d\.]/g, '');
console.log(price);

edited Mar 24 '15 at 13:02

answered Mar 24 '15 at 12:49

I'm Geeker

4,601
5
22
41

I still see the $ sign on the console – user4571629 Mar 24 '15 at 12:57
1

That is because this only replaces the first occurence? – MarshallOfSound Mar 24 '15 at 12:58
Why the downvote? also I suggest going with .text instead of .html but that is splitting hairs for this example. – rlemon Mar 24 '15 at 13:20
This will only store the reference, not actually replace it in the DOM. – Ben Fortune Mar 24 '15 at 13:20
@rlemon, replacing text is not effective in this case because there could be nested html elements that would be removed with .text() – MarshallOfSound Mar 24 '15 at 13:29
@MarshallOfSound assuming you need to handle nested elements and throwing .html at it also isn't effective in the long run. In this limited example (as OP provided) .text is the optimal solution. – rlemon Mar 24 '15 at 13:36
@rlemon I am interesting in how .html() would not be effective in the long run? And yes, in this *quote* limited *quote* example .text works. I'm saving Stack the hassle of having to answer "why doesnt this work" when .text() stops working for him :P – MarshallOfSound Mar 24 '15 at 13:37
@MarshallOfSound For starters, because `` is a very possible HTML string. – Madara's Ghost Mar 24 '15 at 13:45
@SecondRikudo Very interesting point, that was a case I did not think of. Too get around that you would have to recurse to all elements inside the div and use .text(). Lets hope OP doens't want `$` in his links :P – MarshallOfSound Mar 24 '15 at 13:48
@MarshallOfSound making assumptions about what happens in the future is the cause of all bugs in software. – Madara's Ghost Mar 24 '15 at 13:48
@SecondRikudo I completely agree, but I ain't writing out a 10 line recurisive thing for this guy to use. He can do that himself based on what we have said in the comments :D – MarshallOfSound Mar 25 '15 at 01:53

score 0 · Answer 4 · answered Mar 24 '15 at 12:50

0

Something like this should work:

$("h1").each(function() {
  var $el = $(this);
  var text = $el.text().replace("$", "");
  $el.text(text);
});

answered Mar 24 '15 at 12:50

Juan G. Hurtado

2,057
16
25

Why you guys are assuming that he has jQuery loaded on his/her page? – Mr. X Mar 24 '15 at 12:52
3

Maybe because title of question and tags? – sinisake Mar 24 '15 at 12:53
1

Only replaces a single occurence – MarshallOfSound Mar 24 '15 at 12:59

score 0 · Answer 5 · answered Mar 24 '15 at 13:08

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$( document ).ready(function() {  
    var val=$('#demo').html().replace('$','');
  $( "div" ).replaceWith( val );
});
</script>
</head>
<body>
<h1 id='demo'>$540</h1>
</body>
</html>

score -1 · Answer 6 · answered Mar 24 '15 at 12:53

-1

Jquery can select based on contents. See https://api.jquery.com/contains-selector/.

What you need to do is:

$( "div:contains('$')" ).remove();

answered Mar 24 '15 at 12:53

Joonatan Talviste

40
6

1

I think OP meant the `$`-sign to be removed and not the whole div – empiric Mar 24 '15 at 13:01

score -2 · Answer 7 · answered Mar 24 '15 at 12:55

$(function() {
  $("#button").click(function() {
    var input = $("#input").val();
    input = input.replace('$', '');
    $("#input").val(input);
  });
});

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <title></title>
    <meta charset="utf-8" />
  </head>
  <body>
    <input type="text" id="input" placeholder="type here..." />
    <button id="button">Remove</button>
  </body>
</html>

This is the JQuery approach, I used replace on click on button to remove $ from input.

Again this only removes a single occurence of a `$` sign – MarshallOfSound Mar 24 '15 at 12:59 — MarshallOfSound, Mar 24 '15 at 12:59

score -4 · Answer 8 · answered Mar 24 '15 at 12:53

-4

function HasDollar() {   
 if($("h1").html().indexOf("$") != -1) 
       return true;
    else
       return false;
}

try this.

answered Mar 24 '15 at 12:53

Douglas Franco

591
5
13

Why should the OP "try this"? Please add an explanation of what you did and why you did it that way not only for the OP but for future visitors to SO. – Jay Blanchard Mar 24 '15 at 14:07

Detect character in div and remove it Javascript or jQuery

8 Answers8

Linked