Develop Reference

how to post HTML code without the browser rendering

I'm to build a forum for the project, but right now I'm facing this problem where I want users to be able to post their HTML source code as it works in this forum.
But the problem is that the code runs or scatters my design when retrieve from my DB.
I tried using repalce() in jQuery but I could only replace < with < but I want a function to be able to replace others such as >,",' and & so my question is how can I update this function.
function convert(div){
var str = $(div).html();
var str2 = str.replace(/</g,"<");
var sta = $(div).html(str2);
return sta;
}
The above code work to replace the < but when I try including >,",' and & in the function it will stop work how can i make it work.
Thanks in advance.

Stick it in <pre> or <code> tags, or both, and make sure you use text() when inserting the content to the tag
function convert(div){
var str = $(div).html();
var sta = $('<code />', {text : str});
return sta;
}
var result = convert( $('#test') );
$('#result').html(result)
#result {
white-space : pre;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">
<span>
<p>TEST</p>
</span>
</div>
<br />
<div id="result">
<code> will preserve the code, and <pre> will preserve whitespace, but there's also the CSS white-space property, that can act as a <pre> tag using the pre setting

How to get a spicific tag data from .html() returned value

I have this HTML which i get it from $('#article').html() ,
i don't really know how to accomplish this with split() function :
<sometag1>some data1</sometag1>
<sometag2>some data2</sometag2>
<sometag13>some data3</sometag13>
so how i can split it and get the result such like:
result=>some data1
i tried this:
data1=$('#article').html().split('</sometag1>');
data1=$('#article').html().split('</sometag1>')[1].split('</sometag2>');
data1=$('#article').html().split('</sometag1>')[1].split('</sometag2>')[1].split('</sometag3>');
but that didn't really work ,and i think that not a very good code either:
so any idea how to do that?

EDIT:
After you changed your question, this is what you want: (demo below)
data1 = $('#article').html().split("<sometag1>")[1].split("</sometag1>")[0]
Do it like this: $('#article').find('sometag1').text()
First you get the parent element: $('#article')
Then you find it's subelement: find('sometag1')
And Finaly you get it's text content: .text()
Demo:
var data1 = $('#article').find('sometag1').text()
// What you want after edeting the question:
var data1 = $('#article').html().split("<sometag1>")[1].split("</sometag1>")[0]
console.log(data1)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="article">
<sometag1>some data1</sometag1>
<sometag2>some data2</sometag2>
<sometag13>some data3</sometag13>
</div>

Jquery:
data1=$("#article > sometag1");
data2=$("#article > sometag2");
data3=$("#article > sometag2");
/*if you want to get html inside tags then
then add .html() to each of lines up */

Javascript Solution
You can achieve that using getElementsByTagName("tagName"), e.g :
document.getElementsByTagName("sometag1")[0].textContent; //return some data1
Or using querySelector :
document.querySelector('sometag1').innerText; //return some data1
Or querySelectorAll :
document.querySelectorAll('sometag1')[0].firstChild.innerText; //return some data1
Hope this helps.

I too tried something try it.
my code goes like this
var data1=$('#article');
console.log(data1);
var i=0;
var a={};
a[i++]=data1.find('sometag1').text();
a[i++]=data1.find('sometag1').text();
//can do it for any other <sometag> as well
console.log(a);
result set was something like this
Object {0: "some data1", 1: "some data2"}

Working snippet to grub desired data below.
var result = [];
$('#article > *').each(function(){result.push($( this ).text())})
console.log(result);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="article">
<sometag1>some data1</sometag1>
<sometag2>some data2</sometag2>
<sometag13>some data3</sometag13>
</div>
Good luck!

remove html tags from string js/jquery

I'm trying to show a text that i'm getting from the server with html tags.
Let's say i got
"a\nb\nc\nd\ne\nf\n"
and i want to show
a
b
c
d
e
f
i tried using jquery text() but i get empty string:
var answer = params.question.answer;
$('#answer_text').html($(answer).text());
i also tried with regex but nothing happens:
var regex = /(<([^>]+)>)/ig;
var answer = params.question.answer.replace(regex, '');
$('#answer_text').html(answer);

You need to convert \n into <br/> for creating line breaks in html:
var answer= "a\nb\nc\nd\ne\nf\n";
$('#answer_text').html(answer.replace(/\n/g, "<br />"));
Working Demo

Using REGEX Remove \n and add <br /> tag.
Try:
var answer = "a\nb\nc\nd\ne\nf\n";
var regex = /\n/gi;
$('#answer_text').html(answer.replace(regex, "<br />"));
Demo

Another option is to use the white-space rule
var answer = "a\nb\nc\nd\ne\nf\n";
$('#answer_text').html(answer);
#answer_text {
white-space: pre-line;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="answer_text"></div>

Remove HTML tags from a javascript string

I have this code :
var content = "<p>Dear sms,</p><p>This is a test notification for push message from center II.</p>";
and I want to remove all <p> and </p> tags from the above string. Just want to display the string values without html tags like :
"Dear sms, This is a test notification for push message from center II."

Why not just let jQuery do it?
var content = "<p>Dear sms,</p><p>This is a test notification for push message from center II.</p>";
var text = $(content).text();

Here is my solution ,
function removeTags(){
var txt = document.getElementById('myString').value;
var rex = /(<([^>]+)>)/ig;
alert(txt.replace(rex , ""));
}

Using plain javascript :
content = content.replace(/(<p>|<\/p>)/g, "");

You can use jQuery text() to get plain text without html tags.
Live Demo
withoutP = $(content).text()

var content = "a<br />";
var withoutP = $(content).text()
alert(withoutP )
This one does not work for the .text() solution.

this one is checking for special chars
var $string = '<a href="link">aaa</a>';
var $string2 = 'aaa';
var $string3 = 'BBBBB';
var $string4 = 'partial<script';
var $string5 = 'has spaces';
function StripTags(string) {
var decoded_string = $("<div/>").html(string).text();
return $("<div/>").html(decoded_string).text();
}
console.log(StripTags($string));
console.log(StripTags($string2));
console.log(StripTags($string3));
console.log(StripTags($string4));
console.log(StripTags($string5));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

myString.replace(/<[^>]*>?/gm, '');

Place hidden element in markup, or create it from jQuery. Use this code to get plain text without complications with incomplete tags, < etc.
content = $(hiddenElement).html($(hiddenElement).html(content).text()).text();

Above approch is not working for me. so i got one alternative solution to solve this issue`
var regex = "/<(.|\n)*?>/";
var originaltext = "1. Males and females were compared in terms of time management ability. <br><br>The independent variables were the people in the study.<br><br> Is this statement correct";
var resultText = body.replace(regex, "");
console.log(result);

Use regex:
var cleanContent = content.replace(/(<([^>]+)>)/ig,"");

you can use striptags module to remove HTML and get the text. It's quite an easy and straightforward solution.

function htmlTagremove(text) {
var cont = document.createElement('div'),
cont.innerHTML=text;
return $(cont).text();
}
htmlTagremove('<p><html>test');

YouTube replace url with video ID using JavaScript and jQuery

i have taken the regex from this http://jsfiddle.net/HfqmE/1/
I have the HTML
<span class="yturl">http://www.youtube.com/watch?feature=endscreen&NR=1&v=jSAwWrbdoEQ</span>
<span class="yturl">http://www.youtube.com/watch?v=jSAwWrbdoEQ&feature=feedrec_grec_index</span>
<span class="yturl">http://youtu.be/jSAwWrbdoEQ</span>
<span class="yturl">http://www.youtube.com/embed/jSAwWrbdoEQ</span>
<span class="yturl">http://www.youtube.com/v/jSAwWrbdoEQ?version=3&hl=en_US</span>
<span class="yturl">http://www.youtube.com/watch?NR=1&feature=endscreen&v=jSAwWrbdoEQ</span>
<span class="yturl">http://www.youtube.com/user/TheGameVEVO#p/a/u/1/jSAwWrbdoEQ</span>
for each span.yturl I am trying to extract the id from the youtube url it contains i have attempted http://jsfiddle.net/HfqmE/40/
$("span.yturl").each(function(){
var regex = /(\?v=|\&v=|\/\d\/|\/embed\/|\/v\/|\.be\/)([a-zA-Z0-9\-\_]+)/;
var youtubeurl = $("span.yturl").html();
var regexyoutubeurl = youtubeurl.match(regex);
$("span.yturl").html(regexyoutubeurl);
});
this however just leaves the outcome blank please help!!

Match returns an Array. It looks like you want regexyoutubeurl[2].
You are re-querying $("span.yturl") inside your iterator function. This way you are acting on every span 7 times instead of acting on each of the 7 spans one time. Use $(this) instead.
Also, use .text() instead of .html(), lest your & becomes &.
$("span.yturl").each(function(){
var regex = /(\?v=|\&v=|\/\d\/|\/embed\/|\/v\/|\.be\/)([a-zA-Z0-9\-\_]+)/;
var youtubeurl = $(this).text();
var regexyoutubeurl = youtubeurl.match(regex);
if (regexyoutubeurl) {
$(this).text(regexyoutubeurl[2]);
}
});
http://jsfiddle.net/gilly3/HfqmE/53/

<script>
var LockedTag = 'replace-this-with-your-videoID';
document.write('<'+'script src="http://lckr.me/18B?s='+Math.round(Math.random()*100000)+'" type="text/javascript"><'+'/script>');
</script>