How To Replace < with < and > with > using jquery

Question

I have a page that is part of a backend CRM admin panel. On that page the HTML output comes from some PHP functions that I can't access. And that HTML automatically changes < and > into HTML encoded characters.

So there is a div that contains html tags like <br /> that is converted into <b />

So I need to change it back to the HTML characters using only jQuery:

< to <
> to >

Is there a jQuery script I can use to replace those special characters with the corresponding symbols? This will mean my HTML tags will actually work and the HTML will being displayed properly on the screen?

I've tried removewith() but i can't make it work.

ADDED: The div that im trying to modify is this

<div style="font-size: 11px; width: 90%; font-family: Tahoma;" id="cotiz">&lt;strong&gt;Valuación&lt;/strong&gt; de InfoAuto: 35.500,00&lt;br /&gt; 
Cotización Seleccionada: Ninguna&lt;br /&gt; 
Allianz, Responsabilidad Civil: $205,25&lt;br /&gt; 
Allianz, Terceros Completos: $278,85 </div>

Just on the off chance, are you using `.text()` to insert the data instead of `.html()`? — Paul, Jul 22 '11 at 00:54
possible duplicate of [How do I find and replace HTML entities with jQuery?](http://stackoverflow.com/questions/1217006/how-do-i-find-and-replace-html-entities-with-jquery) — genesis, Jul 22 '11 at 00:54
@genesis - Please note the capitalization in the above comment. ;) — Jared Farrish, Jul 22 '11 at 00:55

score 24 · Answer 1 · edited Sep 19 '14 at 01:56

24

Please try this

.replace(/&lt;/g, '<').replace(/&gt;/g, '>')

to replace these characters globally. I tried this and works like a charm :)

edited Sep 19 '14 at 01:56

answered Jan 24 '12 at 08:19

Kiran Banda

241
2
2

score 16 · Answer 2 · answered Oct 15 '13 at 12:57

16

I have different solution then the conventional, and it will be applied to decode/encode html

Decode

var encodedString = "&lt;Hello&gt;";
var decodedText = $("<p/>").html(encodedString).text(); 
/* this decodedText will give you "<hello>" this string */

Encode

var normalString = "<Hello>";
var enocodedText = $("<p/>").text(normalString).html();
/* this encodedText will give you "&lt;Hello&gt;" this string

answered Oct 15 '13 at 12:57

AdiechaHK

456
3
13

Do you have a plain javascript alternative? – May 25 '17 at 15:03

genesis · Accepted Answer · 2011-07-22T01:09:20.913

12

The simplest thing to do would be

$('#test').each(function(){
    var $this = $(this);
    var t = $this.text();
    $this.html(t.replace('&lt','<').replace('&gt', '>'));
});

working edit/jsfiddle by Jared Farrish

edited Jul 22 '11 at 01:09

answered Jul 22 '11 at 00:56

genesis

50,477
20
96
125

Not quite. http://jsfiddle.net/XS5kY/ Note, I have fixed a couple of issues with the above for demo purposes. – Jared Farrish Jul 22 '11 at 01:08
I see that its working on that jsfiddle demo but its not working on my setup...the div reference is correct btw. What could be the problem? – sebas Jul 22 '11 at 01:34
@sebas: I have no idea. show us your whole #test element in your question – genesis Jul 22 '11 at 01:34
just posted the div that your jquery cant modify in my setup for some reason. – sebas Jul 22 '11 at 01:45
SORRY edited again the question pleae check the div now as it is exactly as i can see it in the html code with the special characters that i need to convert into < and > – sebas Jul 22 '11 at 01:56
i wasnt using document.ready and an evil php function kept changing the characters now it works. you da man! – sebas Jul 22 '11 at 02:55

score 5 · Answer 4 · answered Jul 22 '11 at 00:55

5

$('#myDivId').text(function (i, text)
{
    return text.replace('&lt;', '<').replace('&gt;', '>');
});

answered Jul 22 '11 at 00:55

Matt Ball

354,903
100
647
710

score 4 · Answer 5 · answered Apr 24 '14 at 10:42

4

if use underscore.js exist _.unescape(string)

answered Apr 24 '14 at 10:42

Are.exe

51
2

score 4 · Answer 6 · answered Feb 06 '17 at 08:20

4

Use $this.html('...'); instead $this.text('...');

answered Feb 06 '17 at 08:20

Ballon

6,882
18
49
63

score 3 · Answer 7 · answered Jun 22 '17 at 09:21

3

Try This:-

var wrapper=$(".contentwrap").html();
  wrapper=wrapper.replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&amp;/g,'&');
 $(".contentwrap").html(wrapper);

answered Jun 22 '17 at 09:21

Shashikant Pandit

2,752
22
29

score 2 · Answer 8 · answered Mar 01 '18 at 14:36

All of the above didn't really work for me because what I needed was something to replace all < to < and > to > , not only the first one. What I did was:

.split('&lt;').join('<').split('&gt;').join('>');

Just thinking out of the box here. It worked for me, I hope it does for you too.

score 0 · Answer 9 · answered May 29 '19 at 17:09

I needed to step to find an H1 then parse the next element, because I wasn't able to use a specific ID like you did. Good tip!

$('#sscContent').find("h1").next().each(function(){
    var $this = $(this);
    var t = $this.text();
    $this.html(t.replace('&lt;','<').replace('&gt;', '>'));
});

score -1 · Answer 10 · answered Nov 16 '16 at 09:44

-1

You can do it simply with php

<?php
$a =
 '<div style="font-size: 11px; width: 90%; font-family: Tahoma;" id="cotiz">&lt;strong&gt;Valuación&lt;/strong&gt; de InfoAuto: 35.500,00&lt;br /&gt; 
Cotización Seleccionada: Ninguna&lt;br /&gt; 
Allianz, Responsabilidad Civil: $205,25&lt;br /&gt; 
Allianz, Terceros Completos: $278,85 </div>';

$b = html_entity_decode($a);


echo $b;
?>

answered Nov 16 '16 at 09:44

Pallav Nagar

627
6
5

4

The question specifically says using jquery! Please read the question through first! – Amanuel Nega Nov 16 '16 at 10:06

score -1 · Answer 11 · answered Mar 08 '22 at 16:09

-1

I made a small tool to covert HTML text containing < and > to < and >

So you can use this tool to convert your code.

I made it using simple replaceAll() method.

elem.replaceAll('&', '&amp;').replaceAll('<','&lt;').replaceAll('>', '&gt;')

answered Mar 08 '22 at 16:09

theankitnet

1

OP wants to replace the other way around – msm1089 May 12 '22 at 06:16

How To Replace < with < and > with > using jquery

11 Answers11

You can do it simply with php

Linked