select element starting with class name and contain part of string

Question

I'm gonna select element with class but named 'path_from' etc.

Let me show you example

<div class='path_from_5_to_6'></div>
<div class='_6'></div>
<div class='path_from_6_to_5'></div>
<div class='path_from_3_to_2'></div>

I want to select element which class is start with path_from but contain '_6'

How can I do this?

[`class='(path_from[^']*6.*?)'`](https://regex101.com/r/tA5iD7/1) — Tushar, Jun 03 '16 at 15:41
Note that unless you're going for a quick-and-dirty one-time script, you should really avoid using regular expressions to parse HTML. See [this glorious answer](http://stackoverflow.com/a/1732454/1678362) if you're not convinced — Aaron, Jun 03 '16 at 15:44

Nenad Vracar · Accepted Answer · 2016-06-03T15:46:12.210

8

You can use [class^="path_from"][class*="_6"] attribute selector

[class^="path_from"] - class starts with path_from
[class*="_6"] - class contains _6

[class^="path_from"][class*="_6"] {
  background: blue;
}

<div class='path_from_5_to_6'>DIV</div>
<div class='_6'>DIV</div>
<div class='path_from_6_to_5'>DIV</div>
<div class='path_from_3_to_2'>DIV</div>

edited Jun 03 '16 at 15:46

answered Jun 03 '16 at 15:42

Nenad Vracar

118,580
15
151
176

1

I did not saw your answer. I upvote you and delete mine because it was the same as mine \o/ – Francisco Romero Jun 03 '16 at 15:45

score 0 · Answer 2 · answered Jun 03 '16 at 15:43

0

here is an example

[class*="path"][class*="6"] {
  width: 100px;
  height: 100px;
  background: yellow;
}

<div class="path_To_6"></div>

answered Jun 03 '16 at 15:43

Hitmands

13,491
4
34
69

Midas · Answer 3 · 2016-06-03T15:47:18.497

0

You don't. That is what you use class and id for. class for related elements and id for individual elements.

<div class="path_6" id="path_from_5_to_6"></div>
<div id="_6"></div>
<div class="path_6" id="path_from_6_to_5"></div>
<div id="path_from_3_to_2"></div>

Then you select using .path_6 only:

.path_6 {
  // styles
}

edited Jun 03 '16 at 15:47

answered Jun 03 '16 at 15:46

Midas

7,012
5
34
52

Yes, you can do it with type selectors. Look at @NenadVracar answer. – Francisco Romero Jun 03 '16 at 15:46

select element starting with class name and contain part of string

3 Answers3