JSFiddle - React, Tailwind, and code Playground
HTML
<table id="artikelposition" data-url-singlearticle="/app_dev.php/_ajax/editSingleArticle" class="tableArticleList">
<tr class="OfferPosition trAvailableArticle trAvailableArticleNoneBackground"
id="2445"
data-mbsartikel="STLVMAMÜ4"
data-zusatztext="asdfasdf"
data-artikelid="2445"
data-artikelnummer="890"
data-gewerk="73"
data-anzahlparameter="1"
data-preis="3.12"
data-p1einheitbezeichnung="m²"
data-p1einheit="15.00"
data-p2einheitbezeichnung=""
data-p2einheit="0.00"
data-p3einheitbezeichnung=""
data-p3einheit="0.00"
data-mindermenge=""
data-mindermengenartikel="0"
data-artikel="Tapete entfernen"
data-beschreibung="Tapete an Decke oder Wand bis zu 2 Lagen entfernen Klebereste entfernen, Untergrund reinigen und Bauschutt entsorgen."
data-position="1"
>
<td class="tdArticleNumber">
<span class="spanPositionNummer" >1</span>
</td>
<td>
<span>Tapete entfernen</span>
<br>
<span>Tapete an Decke oder Wand bis zu 2 Lagen entfernen Klebereste entfernen, Untergrund reinigen und Bauschutt entsorgen.</span>
<br>
...
CSS
img.imgPointer {
cursor: pointer;
}
img.imgDisplayNone {
display: none;
}
JavaScript
$(document).ready(function(){
$(".rowUp,.rowDown").click(function(){
var row = $(this).parents("tr:first");
if ($(this).is(".rowUp")) {
row.prev().find(".spanPositionNummer").html(row.index() + 1);
row.insertBefore(row.prev());
} else {
row.next().find(".spanPositionNummer").html(row.index() + 1);
row.insertAfter(row.next());
}
row.find(".spanPositionNummer").html(row.index() + 1);
});
});