How can I put
tag in contents with JQuery?

Question

In my <td> tag, there are few -. in it. What I want to do is, put <br> tag in front of this specific word. I did replace() function but it changed just one -. How do I find all instances of -.?

Original Text

Lorem Ipsum is simply dummy text of the printing and typesetting industry. -.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -.It has survived not only five centuries, but also the leap into electronic typesetting.

What I want

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

-. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.

-. It has survived not only five centuries, but also the leap into electronic typesetting.

This is my Code example

<table class="Notice">
    <thead>
        <tr>
            <th>Name</th>
            <th>Number</th>
        </tr>
    <thead>
    <tbody>
        <tr>
            <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. -.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -.It has survived not only five centuries, but also the leap into electronic typesetting.</td>
        </tr>
    </tbody>
</table>

Javascript

$('td:contains("-.")').html(function (i, htm) {
    return htm.replace(/-./g, "<br>-.");
});

Solution

I found my mistake - I didn't do 'every' word. So I used the each() function, and it works perfectly!

$('td:contains("-.")').each(function () {
    $(this).html($(this).html().replace(/-./g, "<br>-."));
});

possible duplicate of [Replacing all occurrences of a string in JavaScript](http://stackoverflow.com/questions/1144783/replacing-all-occurrences-of-a-string-in-javascript) — kuldeep.kamboj, Mar 10 '15 at 05:01
Can you provide your javascript code where you used replace(). May be there is a mistake threre? Actually it should work as you expect. See for an examples here: http://www.w3schools.com/jsref/jsref_replace.asp — candle, Mar 10 '15 at 05:15
@GuruprasadRao add in front of this! I used 'replace' method because I thought it change html and do
tag. — naanace, Mar 10 '15 at 05:30
Try the replaceAll function from here: http://stackoverflow.com/questions/1137436/useful-javascript-methods-that-extends-built-in-objects/1137579#1137579 — candle, Mar 10 '15 at 05:37

score 3 · Answer 1 · answered Mar 10 '15 at 05:23

3

Use JavaScript replace() function with global matching.

replace(/-/g,"<br />-");

answered Mar 10 '15 at 05:23

Amit

827
10
17

Thanks :) But that function was just for one `-.` . Finally I solved myself with each() function. `$('td:contains("-.")').each(function () { $(this).html($(this).html().replace(/-./g, "
-.")); });` this works! – naanace Mar 10 '15 at 05:45

score 2 · Answer 2 · answered Mar 10 '15 at 05:44

Try this:

<!DOCTYPE html>
<html>
<body>

<p>Click the button</p>

<p id="demo">Lorem Ipsum is simply dummy text of the printing and typesetting industry. -.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -.It has survived not only five centuries, but also the leap into electronic typesetting.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    var text = document.getElementById("demo").innerHTML; 
    text = text.replace(new RegExp("-.","g"), "<br>-.");
    document.getElementById("demo").innerHTML = text ;
}
</script>

</body>
</html>

Thanks your help,@candle :) I can adjust this when I using button. — naanace, Mar 10 '15 at 05:54

score 0 · Answer 3 · answered May 28 '21 at 18:41

JavaScript

<p id="changeMe"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. -.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -.It has survived not only five centuries, but also the leap into electronic typesetting.</p>
 <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0.min.js"></script> -->
<script>
 
 var p = document.getElementById("changeMe");
 p.innerHTML = p.innerHTML.replace(/-./g, "<br>-. ");
 </script>

How can I put tag in contents with JQuery?