jQuery .wrap() isn't working

Question

I\'m probably doing something wrong but I\'ve tried all sorts of things and can\'t seem to get a collection of jQuery objects wrapped. The following just outputs the link HTML,

Answer 1

It looks like you mean to use jQuery's html method to add html in the second to last line - unless $dropdownSections is an array with each element being a jQuery object. I think you might be after this:

$.each(sitemapSections, function(i) {
  var $sitemapSection = $(sitemapSections[i]);
  var $primary = $sitemapSection.find('[data-level="1"]').wrap('
');

  $dropdownSections.eq(i).html($primary.parent().html());
});

or more written another way:

$.each(sitemapSections, function(i) {
  $dropdownSections.eq(i).html(
    $(sitemapSections[i])
    .find('[data-level="1"]')
    .wrap('
')
    .parent()
    .html()
  );
});

if $dropdownSections is an array which has a jQuery object in each element:

$.each(sitemapSections, function(i) {
  $dropdownSections[i].html(
    $(sitemapSections[i])
    .find('[data-level="1"]')
    .wrap('
')
    .parent()
    .html()
  );
});