html generated from ajax response doesnt call the hide()

html generated from ajax response doesnt call the hide()

why does this not work for clickable images -essentially buttons, generated by ajax response but works if you just put it all on one page

the image (works when pre generated, but not when generated by an ajax response):
<img src='img/minus-8.png' class='button' />

the javascript:
  $(document).ready(function(){

    $(".button").click(function(){
   someElement.hide();
    });

  });

the workaround i did was

the image (html generated by ajax response):
<img src='img/minus-8.png' class='button' onClick="dostuff();"/>

the javascript
function dostuff()
{
   someElement.hide();
}


Thanks,

PS, I'm not new to programming but I am new to jquery, ajax, javascript

excuse the n00bness