JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/ui-lightness/jquery-ui.css">
<div>
    <a href="http://stackoverflow.com">Already a link</a>
    <ul>
        <li>
            <span>
                http://apple.com
            </span>
        </li>
    </ul>
    content
    http://microsoft.com
    more content
    http://yahoo.com
    <span>more conten http://google.com </span>
</div>

JavaScript

var re = /(http:\/\/[^ ]+)/g;
var temp = document.createElement('div');

function createLinks( els ) {
    var nodes = els.childNodes, node;
    for( var i = 0; i < nodes.length; i++ ) {
        node = nodes[ i ];
        if( node.nodeType === 1 && node.nodeName !== 'script' ) {
            createLinks( node );
        } else if( node.nodeType === 3 && node.data.match( re ) ) {
            temp.innerHTML = node.data.replace( re, '<a href="$1">$1</a>' );
            while( temp.firstChild ) {
                node.parentNode.insertBefore( temp.firstChild, node );
            }
            node.parentNode.removeChild( node );
        }
    };
}

createLinks( document.body );