Обрезать текст по условию

[sashgera]

Здравствуйте
Если див с классом c_name будет по ширине больше дива с классом c_wrap, то по условию текст обрезается, оставляя последние 10 символов
Пожалуйста, подскажите, как обрезать текст ровно на столько символов, чтобы ширина дива .c_name не превысила ширину .c_wrap

(white-space:nowrap;overflow.... мне не подойдет)

<div id="page_site" style="width: 300px;"> <!-- ширина страницы сайта -->
<div class="c_wrap" style="border: 1px solid #E6E6E6; height: 20px;">
<div class="c_name" style="float: left;">
1234567890абвгдежзик1234567890лмноп рст1234567890
</div>
</div>
</div>


<script>
$(document).ready(function(){
wrp = $('.c_wrap').outerWidth();
nam = $('.c_name').outerWidth();
if(wrp <= nam) {
$(".c_name").text('... ' + $(".c_name").text().slice(-10));
}
});
</script>

[DynkanMaclaud]

sashgera,
https://jsfiddle.net/2mdv5rkp/13/

[sashgera]

DynkanMaclaud, спасибо!

[sashgera]

DynkanMaclaud, подскажите пожалуйста, как в вашем примере, обрезать текст с начала (сейчас текст обрезается с конца) и как перед обрезанным текстом показать троеточие '...'

[DynkanMaclaud]

sashgera,
https://jsfiddle.net/2mdv5rkp/15/
Но с ... ширина будет больше 300 (в данном примере) или надо чтобы была меньше с ... ?

[sashgera]

DynkanMaclaud, спасибо!

[sashgera]

DynkanMaclaud, только что заметил, обрезанный текст с троеточием не умещается в диве

[DynkanMaclaud]

sashgera,
https://jsfiddle.net/oj7d7k0b/
особо не тестил если что пиши...

[sashgera]

DynkanMaclaud, да теперь все OK, еще раз спасибо!