Question

Below is my current code. And it is working fine, but I need the .code class element to display as plain text and not render as HTML.

jQuery:

$(document).ready(function( ) {
 $('.code').hide();
 $('.codeLink').toggle(
    function() {    
   $(this).next('.code').fadeIn();
     $(this).addClass('close');
    },
    function() {
      $(this).next('.code').fadeOut();
        $(this).removeClass('close');
  }
); // end toggle
});

HTML:

<a class="codeLink" style="margin-bottom: 10px; display: block;" href="#">Get The   Code</a>
<div class="code"><a class="benefitsQandA" href="#">Get an Instant Quote &amp;    Apply</a></div>

This section of the .code class should display on the screen exactly like this (in other words not rendered as HTML just as text):

<a class="benefitsQandA" href="#">Get an Instant Quote &amp; Apply</a>

Answer 1

try this:

$(".code").text($(".code").html());

of course, if you are doing that to multiple divs, you would need to use .each:

$(".code").each(function(){
    $(this).text($(this).html());
});