I have a problem that I'm trying to solve but can't find the cause.i am using ckeditor5 i have problem when i try to add html classes via editor
<ul class="test">
<li>twsafs</li>
<li>twsafs</li>
<li>twsafs</li>
<li>twsafs</li>
</ul>
i want to use it like this but the editor is rendering as below
<ul>
<li class="test">
twsafs
</li>
<li class="test">
twsafs
</li>
<li class="test">
twsafs
</li>
<li class="test">
twsafs
</li>
</ul>
I can't figure out the reason, if you can help I would be glad
I tried to allow all classes with htmlSupport but no change.
i try
Related
I am trying to add an <a> tag to a list of li with the help of jQuery.
The html looks like this:
<div class="level one">
<ul class="kitchen-tools">
<li class="my list"></li>
<li class="my list"></li>
<li class="my list"></li>
</ul>
</div>
I created an empty <a> tag with jQuery. Unfortunately I can't find a way to add this <a> tag to all my <li> (I tried the jQuery append method).
let aTag = $("a");
$(".my list").append(aTag);
I am new to coding, so I am sure I am doing a silly mistake here. Thanks in advance.
$('.my.list').append('<a>') is all you need:
$('.my.list').append('<a>')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="level one">
<ul class="kitchen-tools">
<li class="my list"></li>
<li class="my list"></li>
<li class="my list"></li>
</ul>
</div>
Since your list items have two classes you need to select them with $('.my.list')
<ol ng-repeat="item in ctrl.items">
<h3 ng-bind-html="item.title"></h3>
<li ng-repeat="description in item.items" ng-bind-html="description"> </li>
</ol>
This is how it is rendered on screen:
**Title1**
1. Desciption1
2. Description2
**Title2**
1. Description1
But as per the HTML standards, ol should only contain li, not h3.
Any idea how we can achieve this?
Why don't you just wrap this construction in one more block? Placing h3 tag in this case will be correct enough.
<div ng-repeat="item in ctrl.items">
<h3 ng-bind-html="item.title"></h3>
<ol>
<li ng-repeat="description in item.items" ng-bind-html="description"></li>
</ol>
</div>
In other case, if you would like to create list of lists and you really want to use <ol> for both you can do in the next way:
<ol ng-repeat="item in ctrl.items">
<li>
<h3 ng-bind-html="item.title"></h3>
<ol>
<li ng-repeat="description in item.items" ng-bind-html="description"></li>
</ol>
</li>
</ol>
In this way you have nested lists, but all h3 tags are inside the li tag, not inside the oldirectly. That is fine. HTML syntax rules allow headings tags in the li elements. I would prefer to use first variant, because it looks clearer and more understandable.
But second one also is a valid HTML structure according to W3 validator:
Use div inside li tag
as follows:
<li ng-repeat="description in item.items">
<div>
<h3 ng-bind-html="item.title"></h3>
<div ng-bind-html="description"></div>
</div></li>
I am using js mmenu on the shopify site. I run into issue which I cant figure out.
When there is a dropdown menu, parent link becomes not clickable and has #mm-0 at the end of it. I need to keep it as is and link to its own page.
You can see code below. Right now Links "Products" and "About" go to https://www.irestorelaser.com/products/irestore-laser-hair-growth-system#mm-0 . Any help would be great!
<div id="nav" >
<ul>
<li >How it works</li>
<li class="Selected">Products
<ul>
<li class="Selected">Laser Helmet</li>
<li >All Products</li>
</ul>
</li>
<li >About
<ul>
<li >Warranty</li>
</ul>
</li>
</ul>
</div>
I am new to HTML and CSS, but I have an idea on JavaScript.
Previously, I made a horizontal switch in the following way using flat-ui from flat-ui
Now I want to implement vertical switch in the following way
How can I make it?
something like this?
<ul class="body">
<li >
<a>switch #1</a>
</li>
<li class="active">
<a>switch #2</a>
</li>
</ul>
See the css and animation in link
jsfiddle.net/uNFWX/
I have one ul li list and I want to put that content between ..
What I have
<div id='a'>
<ul>
<li>
<li>
<li>
</ul>
</div>
what I want to do is that using jquery I want to add div before and after this content like this
What I want
<div id='a'>
<div id='b'>
<ul>
<li>
<li>
<li>
</ul>
</div>
</div>
What I am using is append or before but not getting properly result.
I used following code.
$("#a").prepend("<div id='b'>");
$("#a").append("</div>");
But I got result like this.
<div id='a'>
<div id='b'></div>
<ul>
<li>
<li>
<li>
</ul>
</div>
please help me.
You can use .wrap() to do this:
$("ul").wrap("<div id='b'></div>");
Demo Fiddle
Use wrap()
This will exactly do what you want:
$("#a > ul").wrap("<div id='b'></div>");
Look at the doc: http://api.jquery.com/wrap/
Try this
$("ul").wrap("<div id='b'></div>"); and here is the working example