AbhimanyuSingh AbhimanyuSingh - 6 months ago 18
jQuery Question

Convert a javascript object to DOM element

I am getting the following in the developer console.

<img src="http://localhost/baazar_search/public/assets/uploads/images/logo/f5257d77-75c3-426b-867a-8dea600f7345.jpg" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 50px; height: 50px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; opacity: 1;">


The type of is of above is showing
OBJECT
. I want to apply method addClass() to above image element. How to convert this object to DOM element.

Script is-

for (k = 0; k < offerCode.length; k++)
{
console.log(offerCode[k]);
console.log(typeof offerCode[k]);
}

var offerCode = $("#markerLayer").find("[src='" + requiredImage + "']");

Answer

DOM elements are objects -- typeof doesn't distinguish between all the different types of objects.

addClass() is a method on a jQuery object, not a DOM element, so you need to convert the DOM element to jQuery. Use $() to do this.

$(offerCode[k]).addClass("some-class");

Or, since offerCode is a jQuery collection, you can use

offerCode.addClass("some-class");

This will add the class to all the elements in the collection.