0

With the help of JS/Jquery I am trying to add css after a last child element but am completely lost on how to do that! More specifically I would like to implement the following three times, so I get three "dots".

.milestone:last-child {
  position: relative;
  .milestone_line:after {
    position: absolute;
    content: '';
    display: block;
    height: 12px;
    width: 12px;
    border-radius: 20px;
    bottom: -25px;
    background-color: green;
  }
}

function milestoneEllipsis() {
  for (var i = 0; i < 3; i++) {
    var lastMilestone = $('.milestone:last-child > milestone_line').after("the css content");
    console.log(lastMilestone);
  }
}
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
felixo
  • 1,453
  • 6
  • 33
  • 60
  • 1
    jQuery cannot access pseudo elements such as `:after` and `:before`, so the manner you're trying to do this in is not possible. A workaround would be to add a class to the elements using jQuery and then hook the `:after` selector in your CSS from that class – Rory McCrossan Apr 04 '19 at 09:27
  • you can try .after() but it's not a good way I mean it's better to do it on css – LucasLaurens Apr 04 '19 at 09:31
  • @LucasLaurens The OP is already using `after()`, but it won't work because it's about injecting content in to the DOm instead of amending CSS – Rory McCrossan Apr 04 '19 at 09:35

0 Answers0