Question

I have HTML code:

<ul class="breadcrumb">
    <li><a href="#">Home</a> <span class="divider">/</span></li>
    <li><a href="#">Library</a> <span class="divider">/</span></li>
    <li class="active"><a href="#">Data</a></li>
</ul>

which I want to be changed by JavaScript based on javascript $currentPath variable which stores string like this: “/var/www/stackoverflow”
So in example above my breadcrumbs should look like:

<ul class="breadcrumb">
    <li><a href="#">var</a> <span class="divider">/</span></li>
    <li><a href="#">www</a> <span class="divider">/</span></li>
    <li class="active"><a href="#">stackoverflow</a></li>
</ul>

Could someone help me with this?

Answer 1

you can split the variable like this.

var url = $currentPath.split('/'); //now url = ["", "var", "www", "stackoverflow"]
var breadcrumb = '';
//Use a for loop
for(var i=0;i<url.lenght;i++){
  if(url[i]!=''){
    breadcrumb = '<li><a href="#">'+url[i]+'</a> <span class="divider">/</span></li>'
  }
}