How to trigger an event if a group of elements have not been clicked

What way would you be able to trigger an on blur style event, only if a group of elements are not clicked. for example: if you wanted to make a custom drop down after an input, here is a fiddle of what I'm trying to achieve; http://ift.tt/1MKgwxa Clicking on any element that is not in the first list, should cause the list to collapse.

I have tried stopping the blur, however I can't seem to get it to work.

$('ul').hide();
$('input').focus(
    function(){    
        $('ul').show()
    }
);
$('.hidelist').click(
    function(){
        $('ul').hide();
    }

)
$('input').blur(
    function(){
        $('ul').hide();
    }
);

.results{
    background-color:pink;
}

<script src="http://ift.tt/1oMJErh"></script>
<input type="text" />
<div class="results">
    <ul>
        <li><a href="#">I have other functionality and I don't hide the list</a></li>
        <li><a href="#">I have other functionality and I don't hide the list</a></li>
        <li><a href="#">I have other functionality and I don't hide the list</a></li>
    </ul>
    <ul class="hidelist">    
        <li><a href="#"  >I make the list disapear</a></li>
    </ul>
</div>


<div>I am any other element and I make the list disapear</div>

Clicking on any element that is not in the first list, should cause the list to collapse.

via Chebli Mohamed