Prototype.js Helper

$ function
<div id="item1">1111111111</div>
<div id="item2">11111111112</div>
<div id="item3">1111111113</div>
<div id="itemid1">1111111114</div>
<div id="itemid2">1111111115</div>
<div id="item">1111111116</div>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript">
//['item1', 'item2', 'item3'].each(Element.hide);
$('item1', 'item2', 'item2').invoke('hide');
// Note quite OOP-like
Element.hide('itemid1');
// A cleaner feel, thanks to guaranted extension
$('itemid2').hide();
</script>

$$ function
<div id="item1">1111111111</div>
<div id="item2">11111111112</div>
<div id="item3">1111111113</div>
<div id="itemid1">1111111114</div>
<div id="contents1111">1111111115</div>
<div id="contents">
<a id ='aaaaa' rel="aaaaa" href="my file">a </a>
<a id ='aaaaa' rel="aaaaa" href="todd#">###</a>
<a id ='aaaaa' rel="aaaaa" href="#">### </a>
<a id ='aaaaa' rel="aaaaa" href="my file">a </a>
1111111116</div>
<li class='faux'>as</li>
<div id="sidebar">
<li class='faux' id='navbar'>navbar</li>
<li class='faux' id='sidebar1'>sideba</li>
</div>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript">
// -> all DIVs in the document.  Same as document.getElementsByTagName('div')!
$$('div').each(function(fruit){
  var message = 'I like ' + fruit.innerText
  //alert(message)
  // do something with the message
})
// -> same as $('contents'), only it returns an array anyway.
//alert($$('#contents')[0].innerText)

// -> all LI elements with class 'faux'
//alert($$('li.faux')[0].innerText)

// -> all links inside the element of ID "contents" with a rel attribute
//alert($$('#contents a[rel]'))

// -> all links with a href attribute of value "#" (eyeew!)
//alert($$('a[href="#"]'))

// -> all links within the elements of ID "navbar" or "sidebar"
alert($$('#navbar li', '#sidebar li'))
</script>