Find attribute and element from var with jquery?

Question

I have innerHTML in variable which is get as follows:

 var mash = e.currentTarget.innerHTML;

and Now mash has following values:

"<div class="mashup-details-view">    <div class="mashup-item" data-mashup-id="36967" id="mashup-sort-id">         <div class="mashup-thumbnail" title="Cist">          <span class="x-small thumbnail" style="min-width: 60px; min-height: 34px;"><img onerror="javascript:vidizmo.app.utils.handle_thumbnail_error(this);" src="http://az2213.vo.msecnd.net/vidizmodev/001419/081358/Images/00000c/ImgThumbs/Copa_67100313-4f60-46ff-95c1-907c75b077a8_th1.jpg"></span> </div> <div class="IconDescDiv">     <div class="TitleClass" href="#" title="Cist">Cist</div> </div> </div></div> "

Now i need to get "data-mashup-id" attribute , img tag and class="TitleClass" element how can i get them from variable i am trying to get it via find('img') but cant get it. Please any body can figure this out???

Answer 1

Don't use innerHTML for this. innerHTML generates a string representation of the elements. You want to work directly with the elements.

First, get a jQuery wrapper around the current target:

// `mash` is a jQuery wrapper around the current target
var mash = $(e.currentTarget);

Now you can use CSS selectors to find content within the target and retrieve information from it.

Getting the data-mashup-id value:

// `id` is a string
var id = mash.find("[data-mashup-id"]).attr("data-mashup-id");

Getting the image (you can get information about the image from the resulting object):

// `img` is a jQuery wrapper around the `img` element
var img = mash.find("img");

Getting the div with the "TitleClass":

// `titleElement` is a jQuery wrapper around the `div` with the class
// "TitleClass"
var titleElement = mash.find("div.TitleClass");