Add a class to an element not in the viewport due to overflow:hidden with jQuery
<p>I am trying to add either a class (with display:none) to or hide() divs that are not currently in the viewport due to the fact that I am using overflow-x:hidden. Here's a jsFiddle to hopefully better explain: <a href="http://jsfiddle.net/kendelaney_me/5e2Uz/3/" rel="nofollow">http://jsfiddle.net/kendelaney_me/5e2Uz/3/</a></p>

<p>I have an unordered list where each list item contains divs that are floating left. The ul has a fixed width that is larger than the viewport with overflow-x:hidden. The problem I'm having is if you use the browser's native "find" to search for content Firefox will show a result count but you cannot see the result (since its in the hidden area), Safari and IE manually scroll over to the result which is not desired. My solution is to set all divs that are not currently in the viewport to 'display:none' and therefore hidden from the "find" results. In my application the div that contains the ul has its width set dynamically (as I have done in the jsfiddle). Any help would be greatly appreciated.</p>

<p>Ken</p>
