Tutorials for web designers and developers
Tutorials for Developers_

How to remove unwrapped text in HTML using jQuery?

How-to-remove-unwrapped-text-in-HTML-using-jQuery

Problem:

In the following HTML, there are unwrapped text or strings i.e  ‘ok‘, ‘sure‘ and  ‘nope‘. I want to delete them from my WordPress site. But since they are not wrapped in any HTML tag separately, when I deleted them using CSS property display: none it hides full td content.  Whats the solution to it? I want to delete only the above-mentioned strings while keeping the input tags in td.

<table>
  <tr>
    <td>
      <input type="checkbox" value="hi"> ok
      <br>
      <input type="checkbox" value="hello"> sure
      <br>
      <input type="checkbox" value="hey"> nope
      <br>
    </td>
  </tr>
</table>

Solution:

Please include this jQuery code in your site. Replace td(line 4) with your html tag that contains the string that you would like to replace. Secondly, replace the ok(line 6) keyword with your string that you would like to replace:

jQuery(function($){

	// Replace 'td' with your html tag
	$("td").html(function() { 

		// Replace 'ok' with string you want to change, you can delete 'hello everyone' to remove the text
		  return $(this).html().replace("ok", "hello everyone");  
	
	});
});

After doing this, you will have strings replaced while html still in place.

Full Code:

Here is complete solution on jsFiddle:

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp
Share on email

RECENT POSTS

SUBSCRIBE TO OUR NEWSLETTER​

Loading

Leave a Reply

Your email address will not be published.

RELATED POSTS