How can i remove all characters started with # from inside a div element using jquery or javascript?

Question

As mentioned on the title here is a div element

<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

I use this jquery code to get the whole content of the div element and store it in a variable:

<script type="text/javascript">
var $itemdesc = $('#description').text();
</script>

but how can next remove the content that start with the # hashtag?

Woah, 5 answers for this very simple question. Too much attention! — ManUtopiK, Sep 07 '19 at 15:59

score 1 · Answer 1 · answered Sep 07 '19 at 15:57

If the content is always the same structure - ie: text you want + '#' + text you dont want - then simply split the text content on the character and pass only the first portion to a variable.

let content = document.querySelector('#description').textContent.split('#')[0].trim();


console.log(content); // gives "This is an example text i wanna keep."

<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

You code wont work with muliple lines. Check [this answer](https://stackoverflow.com/a/57835331/1248177) — aloisdg, Sep 07 '19 at 16:00

score 1 · Answer 2 · answered Sep 07 '19 at 15:57

One way to do it would be to split the text based on the # character and just use the first element of the resultant array.

const text = document.querySelector('#description').innerHTML;
const split = text.split('#')
console.log(split[0].trim());

<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

Another option would be to use regular expressions, like in this example: How to match "anything up until this sequence of characters" in a regular expression?.

This wont work if you have one line without '#' after a line with '#' — aloisdg, Sep 07 '19 at 16:05

score 1 · Answer 3 · answered Sep 07 '19 at 15:58

You can do that with simple regex...

var $itemdesc = $('#description').text();

console.log($itemdesc.replace(/^#.*\n/gm, ''));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
This is an example text i wanna keep. 
# And this is the text i want to remove.
This is an example text i wanna keep. 
# And this is the text i want to remove.
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

DjaouadNM · Accepted Answer · 2019-09-07T16:03:49.210

Assuming you want to remove up to the end of the line that contains the #, use replace with this regex #.*\n:

var $itemdesc = $('#description').text();

var $result = $itemdesc.replace(/#.*\n/g, '');

console.log($result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="description" class="bold"> 
This is an example text i wanna keep.
# And this is the text i want to remove.
And keep this as well. 
# And remove this as well.
</div>

aloisdg · Answer 5 · 2019-09-07T16:11:39.960

You achieve this in one line with filter:

Split text by newlines
Filter every lines starting with anything but '#'
Concat back every lines

$('#description').text($('#description').text().split("\n").filter(x => !x.startsWith('#')).join('\n'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

Same solution without JQuery:

document.querySelector('#description').innerText = document.querySelector('#description').textContent.split("\n").filter(x => !x.startsWith('#')).join('\n');

<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

This code will also work with multi lines:

document.querySelector('#description').innerText = document.querySelector('#description').textContent.split("\n").filter(x => !x.startsWith('#')).join('\n');

<div id="description" class="bold"> 
This is an example text i wanna keep. 
# And this is the text i want to remove.
This is an example text i wanna keep. 
# And this is the text i want to remove.
</div>

This is an interesting solution, but seems inefficient, especially if there are a lot of words you have to iterate over! — Nick, Sep 07 '19 at 16:04

How can i remove all characters started with # from inside a div element using jquery or javascript?

5 Answers5