Jquery 在DIV中插入Html标记

如何插入类似

的html标记来括起“搜索”文本

搜索

因为我想在页面宽度等于<900时隐藏“搜索”文本。 因此，它将更改为放大镜图示符图标

我试过jQuery

<script type="text/javascript">
jQuery(document).ready(function(){ 
var windowsize = jQuery(window).width();

jQuery(window).resize(function() {
  windowsize = jQuery(window).width();
  if (windowsize < 900) {
    jQuery('#ihf-quicksearch-submit2').html('<i class="glyphicon glyphicon-search fa fa-search"></i>');
  } if (windowsize >900) {
    jQuery('#ihf-quicksearch-submit2').html(' Search ');
}
});
});
</script>

jQuery（文档）.ready（函数（）{
var windowsize=jQuery（window）.width（）；
jQuery（窗口）.resize（函数（）{
windowsize=jQuery（window）.width（）；
如果（窗口大小<900）{
jQuery（'#ihf-quicksearch-submit2'）.html（''；
}如果（窗口大小>900）{
jQuery（'#ihf-quicksearch-submit2'）.html（'Search'）；
}
});
});

jQuery致力于将“搜索”更改为放大镜图标。但当页面仍在加载时，它仍然显示“搜索”文本。而且在手机版上也不好看

因此，我希望在“搜索”之前有一个“HTML标记”，这样我就可以“显示：无”；使用@media CSS从CSS中删除它

注意：我无法手动插入

，因为我无法从正在使用的插件中找到代码

---

有什么想法吗

您可以根据媒体查询将它们都粘贴在其中并隐藏：

搜寻
@媒体屏幕和屏幕（最大宽度：900px）{
.搜索文本{
显示：无；
}
#ihf-quicksearch-submit2{
不透明度：0；
}
}
@媒体屏幕和屏幕（最小宽度：900px）{
.搜索图标{
显示：无；
}
}
$（“#ihf-quicksearch-submit2”）.html（'Search'）.css（“不透明度”，“1”）；

非常简单-按ID获取按钮的HTML，然后将其修改为字符串，并将其存储回按钮的HTML中

var innerHTML = $('#ihf-quicksearch-submit2').html();
innerHTML = '<p>' + innerHTML + '</p>';
$('#ihf-quicksearch-submit2').html(innerHTML);

var innerHTML=$（'ihf-quicksearch-submit2'）.html（）；
innerHTML=''+innerHTML+'
'；
$（'#ihf-quicksearch-submit2'）.html（innerHTML）；

---

这是我问题的答案。以防有人和我一样有问题。我把“Tricky12”和“Jeff Puckett II”这两个词的答案结合在一起，这是他们的功劳

<script type="text/javascript">
jQuery(document).ready(function(){ 
    var innerHTML = jQuery('#ihf-quicksearch-submit2').html();
    innerHTML = '<i class="glyphicon glyphicon-search fa fa-search search-icon"></i><span class="search-text">' + innerHTML + '</span>';
    jQuery('#ihf-quicksearch-submit2').html(innerHTML);
});
</script>


<style>
@media screen and (max-width:900px) {
.search-text {
display: none;
}
}
@media screen and (min-width:900px) {
.search-icon {
display: none;
}
}
</style>

jQuery（文档）.ready（函数（）{
var innerHTML=jQuery（'#ihf-quicksearch-submit2'）.html（）；
innerHTML=''+innerHTML+''；
jQuery（'#ihf-quicksearch-submit2'）.html（innerHTML）；
});
@媒体屏幕和屏幕（最大宽度：900px）{
.搜索文本{
显示：无；
}
}
@媒体屏幕和屏幕（最小宽度：900px）{
.搜索图标{
显示：无；
}
}

如果此div还有其他子级，并且您不需要将它们全部擦除，那么您可以在javascipt中使用此方法

JavaScript

var CodeInsideDiv = document.getElementById("samplediv")
var injection = "<p>sample text</p>"
CodeInsideDiv.innerHTML = injection + CodeInsideDiv.innerHTML

var codeindediv=document.getElementById（“samplediv”）
var injection=“示例文本”
CodeInsideDiv.innerHTML=注入+CodeInsideDiv.innerHTML

在HTML中会发生这种情况

<div id="samplediv">

<p>sample text<p> #<<<--Magic inserted this  here#

<p>SAMPLE TEXT</p>
<div id="nested-div">....</div>   
</div>

示例文本#是的，我已经想到了这一点，我也想这么做，但我找不到插件上的特定代码行。这就是为什么我不能添加任何可以在css上调用的HTML标记/类。这就是为什么我想用“”或“”来包装“搜索”文本的原因。我已经更新了答案，只需找到元素并替换其内容。在考虑等待页面加载直到jQuery触发后，我又做了一次更新：可以用不透明度隐藏文本，然后在加载时用jQuery重置它。非常感谢您的帮助！我现在解决了我的问题，尽管我仍然需要添加“Tricky12”的答案。我把你的答案合起来了。你们太棒了！：）非常感谢你的帮助！我现在解决了我的问题，我把你的答案和“杰夫·普克特II”结合起来。你们太棒了！：）@MarkLozano没问题，很乐意帮忙！
<div id="samplediv">

<p>sample text<p> #<<<--Magic inserted this  here#

<p>SAMPLE TEXT</p>
<div id="nested-div">....</div>   
</div>