Adding parent tags with jQuery $ .fn.wrap

I am creating all HTML elements using jQuery, and I am trying to wrap the parent div#wrapDivTag

with $.fn.wrap

, but it doesn't work for me:

JQuery

var wrapDivTag = $("<div class='wrapDivTag'></div>");
var actionName = $("<span>text1</span>");
var text = $("<div>Text2</div>")
var ddl = $("<select>Text2</select>")

$("#addconfigurations").append(actionName, text, ddl);

      

HTML output:

<span>text1<span>
<div>text2<div>
<select>options</select>

      

Output Output:

HTML elements must appear below the tag div#wrapDivTag

.

+3


source to share


2 answers


Try the following:



var wrapDivTag = $("<div class='wrapDivTag'></div>");

var actionName = $("<span>text1</span>");
var text = $("<div>Text2</div>")
var ddl = $("<select>Text2</select>");

wrapDivTag.append(actionName, text,ddl); // append all element to #wrapDivTag

$("#addconfigurations").append(wrapDivTag); // append wrap div to target

      

0


source


You can use the wrapAll

method:

$("#addconfigurations").append(actionName, text, ddl).children().wrapAll(wrapDivTag);

      



Or the inverted version with appendTo

:

wrapDivTag.append(actionName, text, ddl).appendTo("#addconfigurations");

      

0


source







All Articles