Jquery or javascript to add one line break <br /> after x amount of characters in a <div>
If you are certain that you always want to insert the break after the fourth character, you can do this:
var html = $("#wine-name").html();
html = html.substring(0, 4) + "<br>" + html.substring(4);
$("#wine-name").html(html);
You can see it in action here.
If you want it to instead break after the first word (delimited by spaces), you can do this instead:
var html = $("#wine-name").html().split(" ");
html = html[0] + "<br>" + html.slice(1).join(" ");
$("#wine-name").html(html);
You can see this in action here.
EDITed for your comment:
$(".wine-name").each(function() {
var html = $(this).html().split(" ");
html = html[0] + "<br>" + html.slice(1).join(" ");
$(this).html(html);
});
See it here.