How can I convert a DOM element to a jQuery element? – Dev

The best answers to the question “How can I convert a DOM element to a jQuery element?” in the category Dev.


I am creating an element with document.createElement().
Now how can I pass it to a function that only takes a Jquery object?


I can not use it, as the element has not been rendered in the page yet.


What about constructing the element using jQuery? e.g.


creates a new div element, ready to be added to the page. Can be shortened further to


then you can chain on commands that you need, set up event handlers and append it to the DOM. For example

$('<div id="myid">Div Content</div>')
    .bind('click', function(e) { /* event handler here */ })


var elm = document.createElement("div");
var jelm = $(elm);//convert to jQuery Element
var htmlElm = jelm[0];//convert to HTML Element


So far best solution that I’ve made:

function convertHtmlToJQueryObject(html){
    var htmlDOMObject = new DOMParser().parseFromString(html, "text/html");
    return $(htmlDOMObject.documentElement);