JSFiddle - React, Tailwind, and code Playground

HTML

<select>
    <option>long long long text and some other text</option>
    <option>long long long text and some other text</option>
    <option>long long long text and some other text</option>
</select>

CSS

select, option {
    max-width: 100px;
}

JavaScript

var $select = $('select');
$select.find('option').each(function () {
    var _tmp = $('<span/>', {
        html: this.innerHTML
    }).css({
        position: 'absolute',
        top: -9999,
        left: -9999
    }).appendTo('body');
    var width = _tmp.width();
    var maxWidth = $select.width();
    while (_tmp.width() > maxWidth) {
        _tmp.text(function (index, text) {
            return text.replace(/\W*\s(\S)*$/, '...');
        });
    }
    this.innerHTML = _tmp.text();
    _tmp.remove();
});