javascript - How to word-wrap a URL? -

word wrap works on long strings without special characters. i'd use on url. rather filling columns in row, text goes next row on encountering special characters =, & etc. there other method solve this? html:

<div style="word-wrap: break-word; width:100px;" id="foo"></div> 

js:

var div = document.getelementbyid("foo"); div.innerhtml = "https://www.google.co.in/search?q=hello+world&ie=utf-8&oe=utf-8&gws_rd=cr&ei=anquvz7zk4kvuati3igidg"; 

js fiddle here.

ps: overflow isn't nice!

try using word-break: break-all;

var div = document.getelementbyid("foo");  div.innerhtml = "https://www.google.co.in/search?q=hello+world&ie=utf-8&oe=utf-8&gws_rd=cr&ei=anquvz7zk4kvuati3igidg";

#foo{    word-break: break-all;  }

<div style="width:100px;" id="foo">        </div>