Home Ask Login Register

Developers Planet

Your answer is one click away!

Nately Jamerson January 2017

outerHtml of undefined in jquery

I have these string

<div class="page">&lt;div class</div><div class="page">=&quot;nodejs-c</div><div class="page">lass&quot;&gt;Wakh</div><div class="page">ed un sing</div><div class="page">e sur son </div><div class="page">argent les</div><div class="page"> appelle d</div><div class="page">e l&#39;argent</div><div class="page"> et garçon</div><div class="page"> asseoir S</div><div class="page">inge incha</div><div class="page">ngée.&lt;&#x2F;div</div><div class="page">&gt;</div>

I try to wrap the page class with pageWrap

var content = $(str).wrap('<div id="source-wrapper"></div>').find('.page')
            .wrap('<div class="pageWrap"></div>')
            .closest('.pageWrap')
            .text(function() {
              return $(this).html()
            })
            .closest('#source-wrapper')
            [0].outerHTML;

I got outHtml of undefined? Is there anything wrong in my text() function?

Answers


Justinas January 2017

Just remove [0] part as #source-wrapper will return only one element and not array of elements.

$(document).ready(function() {
  var content = $('.page').wrap('<div id="source-wrapper"></div>').find('.page')
    .wrap('<div class="pageWrap"></div>')
    .closest('.pageWrap')
    .text(function() {
      return $(this).html()
    })
    .closest('#source-wrapper')
    .outerHTML;
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="page">&lt;div class</div>
<div class="page">=&quot;nodejs-c</div>
<div class="page">lass&quot;&gt;Wakh</div>
<div class="page">ed un sing</div>
<div class="page">e sur son</div>
<div class="page">argent les</div>
<div class="page">appelle d</div>
<div class="page">e l&#39;argent</div>
<div class="page">et garçon</div>
<div class="page">asseoir S</div>
<div class="page">inge incha</div>
<div class="page">ngée.&lt;&#x2F;div</div>
<div class="page">&gt;</div>


Pranav C Balan January 2017

You had already selected .page so find() method won't work here which search .page within it but there are no elements with that class within it. Finally you are trying to get dom object which id undefined and nothing get selected and returns undefined and you are trying to get outerHTML property from undefined.

var str = '<div class="page">&lt;div class</div><div class="page">=&quot;nodejs-c</div><div class="page">lass&quot;&gt;Wakh</div><div class="page">ed un sing</div><div class="page">e sur son </div><div class="page">argent les</div><div class="page"> appelle d</div><div class="page">e l&#39;argent</div><div class="page"> et garçon</div><div class="page"> asseoir S</div><div class="page">inge incha</div><div class="page">ngée.&lt;&#x2F;div</div><div class="page">&gt;</div>';


var content = $(str).wrapAll('<div id="source-wrapper"></div>')
  .wrap('<div class="pageWrap"></div>')
  .closest('.pageWrap')
  .text(function() {
    return $(this).html();
  })
  .closest('#source-wrapper')[0].outerHTML;

console.log(content);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Post Status

Asked in January 2017
Viewed 3,951 times
Voted 14
Answered 2 times

Search




Leave an answer


Quote of the day: live life