Retrieve the text from an ajax response that includes the <tag> element

I have created a simple piece of code to fetch news from an RSS page. Below is the code snippet:

this.loadRecentNews = function loadRecentNews() {
            $.get("http://rss.nytimes.com/services/xml/rss/nyt/GlobalHome.xml", function (data) {
                $(data).find("item").each(function () {
                    var el = $(this);

                    console.log("------------------------");
                    console.log("Title      : " + el.find("title").text());
                    console.log("Link     : " + el.find("link").text());
                    console.log("Description: " + el.find("description").text());
                    console.log("Date: " + el.find("pubDate").text());

                });
            });

        };

Below is the output:

Title : Example of title

Link : http://www.example.com

Description : Example of <<bb>>Description</b> containing <> tag..

Date : Example of date

The challenge I am facing is that I would like to only extract the text content from the Description field in order to create a new JSON object containing this extracted text.

Is there a way for me to extract only the text without the <> values?

Answer №1

Since you are utilizing jQuery, you have the option to utilize its .text() function.

var initialText = "A sample <b>description</b>" ;
var finalText = $("<p>").html(initialText).text() ;

This piece of code uses jQuery to create a new HTML element (which is not actually inserted into the page) and modify its innerHTML. It then utilizes .text() method to extract only the text content.

Another alternative (although more risky) involves using a regular expression to replace anything between < and > with an empty string:

var finalText = initialText.replace(/<[^>]*>+/g, "")

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

New methods for Sequelize ES6 models do not currently exist

Encountering issues while using Sequelize JS v4 with ES6 classes, I'm facing difficulty with the execution of instance methods. Despite being defined in the code, these methods appear to be non-existent. For instance - Model File 'use strict&a ...

Nested Tab Generation on the Fly

My goal is to create dynamically nested tabs based on my data set. While I have successfully achieved the parent tabs, I am encountering an issue with the child tabs. Code $(document).ready(function() { var data1 = [["FINANCE"],["SALE"],["SALE3"]]; var da ...

Issue encountered while adding a record to the database with PHP's mysqli object-oriented programming support

Working with PHP's mysqli to access and insert records into a database using prepared statements. I'm encountering an error that I can't seem to identify. Any help in pointing out the mistake would be greatly appreciated. mailer.php <?p ...

Enhance user experience with dynamic form redirection powered by AJAX and CKeditor integration

I have been trying to achieve AJAX form submission in Laravel using the code snippet below. Despite successful data storage in the database, one particular field appears as NULL in the database upon form submission. <textarea name="content" id="editor ...

Before you start interactivity in three.js, you will be presented with a classic

Recently, I incorporated a 3D WebGL viewer into my website, but I encountered a minor problem. Although everything functions properly and I am able to manipulate the object, there is a brief moment of a black screen upon loading the page before moving the ...

What is the best way to make a select tag read-only before the Ajax request is successful

Is there a way to make a select tag read-only before an Ajax success? I tried using this code, but it didn't work: $("#tower").prop('readonly', true); Then I tried this alternative, but I couldn't get the value from the select tag: ...

Secure the direct access of AJAX-based URLs

Our website allows users to create an ID, but unfortunately, unauthorized individuals can also access this feature. The issue lies in the fact that this page uses AJAX calls for validation, checking if the entered ID format is correct. An attacker could ...

Facing issues using Angular 5 for PUT requests due to 401 errors

When attempting to update data using the PUT Method in my angular service and express routes, I encountered a 401 error. Here is my service code: //401 makeAdmin(_id) { this.loadToken() let headers = new Headers() headers.append('Authorization& ...

Tips for utilizing the AngularJS filter to group by two columns in Angular

In my array of objects, each item has three properties: 1. name 2. team 3. age http://jsfiddle.net/HpTDj/46/ I have successfully grouped the items by team, but I am unsure how to group them by both team and age in my current code. I want to display the ...

Change the Bootstrap components according to the size of the screen

Is there a built-in Bootstrap feature to change an element's class based on screen size? I'm working on a webpage with scrollable card elements. On desktop, the cards are arranged horizontally, but on mobile they are stacked vertically, requirin ...

Create a personalized form with HTML and JQuery

Currently, the data is displayed on a page in the following format: AB123 | LHRLAX | J9 I7 C9 D9 A6 | -0655 0910 -------------------------------------------------------- CF1153 | LHRLAX | I7 J7 Z9 T9 V7 | -0910 1305 ---------------- ...

What is the best way to extract a value from a JSON object?

I am having trouble deleting data from both the table and database using multiple select. When I try to delete, it only removes the first row that is selected. To get the necessary ID for the WHERE condition in my SQL query, I used Firebug and found this P ...

Discover the method for invoking a Javascript function within a Leaflet popup using HTML

Upon clicking on a marker on the leaflet map, I aim to trigger a popup box that contains five elements: Title Description Image Button (Next Image) Button (Previous Image) To achieve this, I attempted to include a custom popup for each feature ...

Sharing images

Sample Code: <form enctype="multipart/form-data"> <input id="upFile" class="upFile" type="file" size="0" name="file" accept="image/gif,image/jpeg,image/png"> <input type="submit" id="upFileBtn" class="upFile"> </form> A ...

Issue with CornerstoneJs React restoreImageIdToolState causing annotations to fail to load automatically post-execution

Once this code is executed, I need the annotations to appear without having to hover over the cornerstoneViewport. const restore = () => { let element; const stack = { currentImageIdIndex: 0, imageIds, }; console.log(dico ...

Install the following packages using npm: tailwindcss, postcss, autoprefixer, error, and next

npm ERR! code ERESOLVE npm ERR! ERESOLVE could not find a solution to the problem npm ERR! npm ERR! While trying to resolve: [email protected] npm ERR! Found: [email protected] npm ERR! node_modules/react npm ERR! requires react@">=16.8 ...

WebPack bundling causing issues with Knockout Validation

I am developing a web application using Knockout along with the Knockout-Validation plugin, and I want to utilize WebPack for bundling. However, I encountered an issue where Knockout-Validation seems to break when incorporated with WebPack. To illustrate ...

Using absolute positioning on elements can result in the page zooming out

While this answer may seem obvious, I have been unable to find any similar solutions online. The problem lies with my responsive navbar, which functions perfectly on larger screens. However, on mobile devices, the entire website appears zoomed out like thi ...

From PHP to JavaScript, the looping journey begins

Question I am attempting to display markers on a map using PHP to fetch the data, then converting it into JavaScript arrays for marker addition. Below is an example of my code: Database query require_once("func/connect.php"); $query = "SELECT * FROM sit ...

The ng-click functionality seems to be malfunctioning when used within the controller in conjunction with ng-bind

After coding, I noticed that my ng-click function is not working. When I inspected the element, I couldn't find ng-click displayed anywhere. Can someone please help me figure out what I'm doing wrong? var app = angular.module('myApp' ...