Check if div contains any overflowing inline-block spans

I'm trying to detect if there are any spans in a container that are overflowing and hidden.

<div class="container">
    <span>one</span><span>two</span><span>three</span><span>four</span><span>five</span><span>six</span><span>seven</span><span>eight</span>
</div>

.

.container {
    width: 150px;
    white-space: nowrap;
    overflow: hidden;
}
span {
    display: inline-block;
    margin-right: 6px; 
}

The only way I could think of doing this is by selecting the last span element, and determining whether it's within the container.

my jsfiddle