jQuery技术:如何使用JQuery将样式应用于正确的标记

我正在尝试为我的代码添加更多逻辑，但它不起作用。 我必须在span标签周围包裹我的图标，以便正确地获得行高。 我正在使用谷歌字体：

html.erb

   favorite_border Add Wishlist  <input type="hidden" class="wish-cls" value="" /> 

SCSS

 ... span.wish-flex{ display: inline-flex; vertical-align: middle; padding-top: 10px } .material-icons.red { color: $hotRed; } span .material-icons{ margin-top: -2px } 

JavaScript的

 $("[data-id=wish]").click(function(e){ e.preventDefault(); var value = $(this).next(".wish-cls").val(); console.log("Clicked: " + value); /* Applying the css when clicked * * We use toggleClass instead of addClass * TODO: Ajax */ $(this).toggleClass("red"); }); 

代码将类red应用于span。 正确，但如何让它将class应用于i标签？ 如果用户单击心脏或单词（添加心愿单），脚本将运行。

也许我可以更改css以获得带有图标和文本的内联样式并删除span ？

 $("[data-id='wish']").click(function(e){ e.preventDefault(); var value = $(this).next(".wish-cls").val(); $("i", this).toggleClass("red"); }); 

以上就是jQuery教程分享如何使用JQuery将样式应用于正确的标记相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。