Jquery/YUI - Find image and set CSS to display:none

Question

I have the following image in a CMS that I want to hide, I dont really want to change source code but would like to hide a specific image which does not have a class applied.

Here is the HTML:

 <td class="right side">
    <a title="Show only topic 1" href="view.php?id=3&topic=1">
    <img alt="Show only topic 1" src="http://vl3.co.uk/iphone/pix/i/one.gif"/&gt;
    </a>
    <br/>
    </td>

I want to hide the <a> and the <img>, bare in mind the title and alt tag can be different so cant use that as an identifier.

I presume I could use .find() and then use .parent() to set the <a> to display: none; thus hiding the img?

Im inlcuding the jQuery library, however the CMS has YUI included out of the box so if anyone has a YUI method it would be appreicated.

Answer 1

The jQuery method would be:

$(".right.side a:first").hide();

This gets the first <a> underneath the class="right side" element and sets it to display: none. Be sure to replace $ with jQuery if using no conflict :)

Answer 2

If you are needing to hide the http://vl3.co.uk/iphone/pix/i/one.gif image everywhere it shows up on the page you can do this:

$("img[src*='iphone/pix/i/one.gif']").parent('a').hide();

Answer 3

YUI 2.x (w/ Selector)

YAHOO.util.Dom.setStyle(YAHOO.util.Selector.query(".right.side a:first"), "display", "none");

YUI 2.x (w/o Selector)

var rightSide = YAHOO.util.Dom.getElementsByClassName("right", "td")[0],
    a = rightSide.getElementsByTagName("a")[0]

YAHOO.util.Dom.setStyle(a, "display", "none");

YUI 3.x

Y.all(".right.side a:first").setStyle("display", "none");