title: JavaScript get a String from a specific charackter to a space
body: <p>i have a shoutbox and want to a username highlighting in the messages. The Shoutbox look like this:</p>
  
  <pre><code>&lt;dl id="sbPosts"&gt;
                  &lt;dt data-id="1780530" data-user="username"&gt;
                      &lt;a href="user/username" class="user"&gt;username&lt;/a&gt;
                      &lt;time&gt;00:00:00&lt;/time&gt;
                  &lt;/dt&gt;
                  &lt;dd data-id="1780530" data-user="username"&gt;
                      @username text without highlight
                  &lt;/dd&gt;
                  &lt;dt data-id="1780530" data-user="username"&gt;
                      &lt;a href="user/username" class="user"&gt;username&lt;/a&gt;
                      &lt;time&gt;00:00:00&lt;/time&gt;
                  &lt;/dt&gt;
                  &lt;dd data-id="1780530" data-user="username"&gt;
                      @username text without highlight
                  &lt;/dd&gt;
                  &lt;dt data-id="1780530" data-user="username"&gt;
                      &lt;a href="user/username" class="user"&gt;username&lt;/a&gt;
                      &lt;time&gt;00:00:00&lt;/time&gt;
                  &lt;/dt&gt;
                  &lt;dd data-id="1780530" data-user="username"&gt;
                      @username text without highlight
                  &lt;/dd&gt;
                  &lt;dt data-id="1780530" data-user="username"&gt;
                      &lt;a href="user/username" class="user"&gt;username&lt;/a&gt;
                      &lt;time&gt;00:00:00&lt;/time&gt;
                  &lt;/dt&gt;
                  &lt;dd data-id="1780530" data-user="username"&gt;
                      @username text without highlight
                  &lt;/dd&gt;
  &lt;/dl&gt;
  </code></pre>
  
  <p>I only want to highlight the "@" and the text after this to the first space like this: "<strong>@skuhlight</strong> whats your question?"</p>
  
  <p>In the shoutbox i want to add a span around the username like this:</p>
  
  <pre><code>&lt;dd data-id="1780530" data-user="username"&gt;
      &lt;span class="highlight"&gt;@username&lt;/span&gt; text without highlight
  &lt;/dd&gt;
  </code></pre>
  
  <p>Here is the code i tried...</p>
  
  <pre><code>  function highlight(username) {
    var element = $('#sbPosts &gt; dd');
    var rgxp = new RegExp(username, '@');
    var res = str.substr(username, ' ');
    var repl = '&lt;dd&gt;&lt;span class="highlight"&gt;' + username + '&lt;/span&gt;';
    element.html(element.html().replace(username, repl));
  }
  </code></pre>