Search code examples
jqueryappendparentclosest

Find text (in a loop) using filter and append another div with thumbmail with jQuery

I'm attempting to filter through a loop of results to find specific text, if it exists, I want to append a single div with a thumbnail image. What I have works, but it appends all of the divs within the loop. I have tried .()closest and .parent(). All of which append all of the divs within the loop. I only want to append the nearest div to the filtered text.

What am I doing wrong? 

if( $("span").text().indexOf('90509BR') >= 0) {
        $('div.little-img').parent().find('div.little-img').append('<img style="float:left;" height="75px" width="75px" id="theImg" src="/images/uploads/EPDM_Yellow_Peroxide_p8sm.png" />');
    }

Here's a fiddle http://jsfiddle.net/C9Fft/4/

Solution

  • .closest won't work in the context of your markup.

    You'll need to traverse the tree in a different way.

    http://jsfiddle.net/justiceerolin/zVe69/

        $('span:contains("90509BR")').parent().prev('div.little-img')
      .append('<img style="float:left;" height="75px" width="75px" id="theImg" src="/images/uploads/EPDM_Yellow_Peroxide_p8sm.png" />');

    :contains does the text search. parent() goes up to .small, and prev looks at the element before it.