Remove DIV tag from Multiline text field using ECMA in SharePoint

This SharePoint tutorial, we will discuss how to remove div tags from multiline text using ECMA script in SharePoint Online or SharePoint 2013/2016.

In my project, I need to show the address in a text area from the multiline text field while the user wants to edit the address. But while I was reading the description I see HTML tags in the text as shown below. I have implemented this code in ECMA scripting.

Remove DIV tag from Multiline text field sharepoint

I was trying to get the car description, as a normal since a line of text field. So it is getting all the HTML tags also in it.

Var aboutcar = objListItem.get_item('AboutCar');

Note: The code block was implemented in ECMA scripting.

Remove DIV tag from Multiline text field using ECMA in SharePoint

Below are different ways we can remove the div tags from the multiline text field using ECMA script in SharePoint Online/2013/2016.

I should remove the div tags from the text with any of below procedures:

  • Apply Regular expression
  • Use jQuery
  • Creating a temporary DOM element

Let us walk through one by one.

Remove DIV tag from Multiline text field by Apply Regular expression

As we know regular expressions help us to replace or remove the test from a string. The below syntax helps us to remove the div tag from the description.

var aboutcar = objListItem.get_item('AboutCar').replace(/[^>]+>/g,'');

The above code will remove all the HTML tags recursively as I used /g.

Remove DIV tag from Multiline text field using jQuery

If you are using jQuery you can use the below code snippet.

var aboutcar = objListItem.get_item('AboutCar');
var abtCarVal = $("<div>").html(aboutcar).text();

Remove DIV tag from Multiline text field by creating a temporary DOM element

This approach involves creating a temporary DOM element with the type DIV. The below code sample explains how we can achieve the HTML tag-free text from Multiline Text fields.

alert(fnRemoveDIVTag(objListItem.get_item('AboutCar'));

Function fnRemoveDIVTag(strDescription)
{
// Create a new div element
 var tmpDivElmnt = document.createElement("div");
 // Set the HTML content with the providen
 tmpDivElmnt.innerHTML = strDescription;
// Retrieve the text property of the element (cross-browser support)
return tmpDivElmnt.textContent || tmpDivElmnt.innerText || "";
}

The output for all the approaches will be:

Remove DIV tag from Multiline text field using ECMA in SharePoint

You may like following SharePoint tutorials:

This SharePoint tutorial, we discuss various approaches to remove Remove DIV tag from Multiline text field in ECMA script in SharePoint Online or SharePoint 2013/2016.

Donwload Hub site pdf

Download SharePoint Online Tutorial PDF FREE!

Get update on Webinars, video tutorials, training courses etc.

>