user3835444
user3835444

Reputation: 67

jQuery Split comma separate and enclose them

I want to split the letters from <div class="ltr">a,b,c,d</div> then enclose them with html codes.

My code:

var ltrs = $('.ltr').text();
var string = ltrs.split(",");

Then I want to enclose each letter with <ul><li>Letter here<li></ul>.

Sample results:

<ul><li>a</li></ul>
<ul><li>b</li></ul>
<ul><li>c</li></ul>
<ul><li>d</li></ul>

Upvotes: 1

Views: 1070

Answers (2)

mateonunez
mateonunez

Reputation: 197

You could do something like this:

var ltrs = $('.ltr').text();
var splitted = ltrs.split(',')
var divs = splitted.map(splitted => `<ul><li>${splitted}</li></ul>`)

Upvotes: 1

0stone0
0stone0

Reputation: 43954

Use map() to loop through each split() result, and add the hTML code.

var all = $('.ltr').text().split(',');
var res = all.map(s => `<ul><li>${s}</li></ul>`);

$('.result').html(res); // Just to show the result
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ltr">a,b,c,d</div>

<div class="result"></div> <!-- Just to show the result -->

Upvotes: 1

Related Questions